@nvidia-elements/core 2.7.2 → 2.8.0

package/dist/preferences-input/preferences-input2.js.map

@@ -1 +1 @@
-{"version":3,"file":"preferences-input2.js","names":["#setColorScheme","#setScale","#setReducedMotion","#i18nController","#updatePreferences","#update"],"sources":["../../src/preferences-input/preferences-input.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, isServer, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { I18nController, scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { state } from 'lit/decorators/state.js';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixins';\nimport { type IconName, Icon } from '@nvidia-elements/core/icon';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { Divider } from '@nvidia-elements/core/divider';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Switch } from '@nvidia-elements/core/switch';\nimport styles from './preferences-input.css?inline';\n\n/* eslint-disable jsdoc/no-types */\n// Explicit JSDoc types because the CEM analyzer loses the inherited generic specialization.\n\nexport type ColorScheme = 'auto' | 'light' | 'dark' | 'high-contrast';\nexport type Scale = 'default' | 'compact' | 'relaxed';\nexport type Variant = 'reduced-motion';\n\nconst colorSchemes: ColorScheme[] = ['auto', 'light', 'dark', 'high-contrast'];\nconst scales: Scale[] = ['default', 'compact'];\nconst colorSchemesIcons = {\n  auto: 'computer',\n  light: 'sun',\n  dark: 'moon',\n  'high-contrast': 'circle-half'\n} satisfies Record<ColorScheme, IconName>;\n\nfunction getActivePreferences(element = globalThis.document.documentElement) {\n  const computedStyle = getComputedStyle(element);\n\n  return {\n    light: computedStyle.getPropertyValue('--nve-config-color-scheme-light') === 'true',\n    dark: computedStyle.getPropertyValue('--nve-config-color-scheme-dark') === 'true',\n    'high-contrast': computedStyle.getPropertyValue('--nve-config-color-scheme-high-contrast') === 'true',\n    compact: computedStyle.getPropertyValue('--nve-config-scale-compact') === 'true',\n    'reduced-motion': computedStyle.getPropertyValue('--nve-config-reduced-motion') === 'true'\n  } satisfies Partial<Record<ColorScheme | Scale | Variant, boolean>>;\n}\n\nexport interface PreferencesInputValue {\n  'color-scheme'?: ColorScheme | string;\n  scale?: Scale | string;\n  'reduced-motion'?: boolean;\n}\n\n/**\n * @element nve-preferences-input\n * @description A preferences input is a widget for controlling apperance. Stylesheets register to the preferences input by including a css-property, see Standard for an example.\n * @documentation https://nvidia.github.io/elements/docs/elements/preferences-input/\n * @since 1.23.7\n * @entrypoint \\@nvidia-elements/core/preferences-input\n * @property {PreferencesInputValue} value - Contains the current color scheme, scale, and reduced motion preferences. Assign an object through JavaScript or provide its JSON serialization in the HTML `value` attribute.\n * @attribute {string} value - JSON object parsed as `PreferencesInputValue`.\n * @event input - Dispatched when the value has changed\n * @event change - Dispatched when the value has changed\n * @cssprop --color\n * @cssprop --width\n * @csspart control - The control wrapper elements that contain the labels and menus\n * @csspart menu - The menu elements that display color scheme and scale options\n * @csspart menu-item - The individual menu item elements for each selectable option\n * @csspart icon - The icon element displayed next to color scheme options\n * @csspart divider - The divider elements that separate preference sections\n * @csspart switch - The switch element for the reduced motion toggle\n *\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/listbox/\n *\n */\n@scopedRegistry()\nexport class PreferencesInput extends FormControlMixin<typeof LitElement, PreferencesInputValue>(LitElement) {\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /**\n   * Enables updating internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-preferences-input',\n    version: '0.0.0',\n    valueSchema: {\n      type: 'object' as const,\n      properties: {\n        'color-scheme': { type: 'string' as const },\n        scale: { type: 'string' as const },\n        'reduced-motion': { type: 'boolean' as const }\n      }\n    }\n  };\n\n  static elementDefinitions = {\n    [Control.metadata.tag]: Control,\n    [Divider.metadata.tag]: Divider,\n    [Icon.metadata.tag]: Icon,\n    [Menu.metadata.tag]: Menu,\n    [MenuItem.metadata.tag]: MenuItem,\n    [Switch.metadata.tag]: Switch\n  };\n\n  @state() private activePreferences: ReturnType<typeof getActivePreferences> = {\n    light: false,\n    dark: false,\n    'high-contrast': false,\n    compact: false,\n    'reduced-motion': false\n  };\n\n  // eslint-disable-next-line max-lines-per-function\n  render() {\n    return html`\n      <div internal-host>\n        <nve-control part=\"control\">\n          <label>${this.i18n.colorScheme}</label>\n          <nve-menu part=\"menu\" nve-control>\n          ${colorSchemes.map(\n            value => html`\n            <nve-menu-item part=\"menu-item\"\n              .selected=${this.value?.['color-scheme'] === value}\n              .value=${value}\n              @click=${() => this.#setColorScheme(value)}\n            >\n              <nve-icon part=\"icon\" name=${colorSchemesIcons[value]}></nve-icon> ${value}\n            </nve-menu-item>\n            `\n          )}\n          </nve-menu>\n        </nve-control>\n        ${\n          this.activePreferences['compact']\n            ? html`\n        <nve-divider part=\"divider\"></nve-divider>\n        <nve-control part=\"control\">\n          <label>${this.i18n.scale}</label>\n          <nve-menu part=\"menu\" nve-control>\n          ${scales.map(\n            value => html`\n            <nve-menu-item part=\"menu-item\"\n              .selected=${this.value?.['scale'] === value}\n              .value=${value}\n              @click=${() => this.#setScale(value)}\n            >\n              ${value}\n            </nve-menu-item>\n            `\n          )}\n          </nve-menu>\n        </nve-control>\n          `\n            : ''\n        }\n        ${\n          this.activePreferences['reduced-motion']\n            ? html`\n        <nve-divider part=\"divider\"></nve-divider>\n        <nve-switch part=\"switch\">\n          <label>${this.i18n.reducedMotion}</label>\n          <input\n            type=\"checkbox\"\n            value=\"reduced-motion\"\n            .checked=${this.value?.['reduced-motion']}\n            @change=${(e: { target: HTMLInputElement }) => this.#setReducedMotion(e.target.checked)}\n          />\n        </nve-switch>`\n            : ''\n        }\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.value = {\n      'color-scheme': 'auto',\n      'reduced-motion': false,\n      scale: 'default'\n    };\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('nve-control', '');\n    this.#updatePreferences();\n  }\n\n  /** @private */\n  updateValue(value: PreferencesInputValue) {\n    super.updateValue({ ...this.value, ...value });\n    this.#updatePreferences();\n  }\n\n  #updatePreferences() {\n    /* istanbul ignore else -- Lit SSR mode is not reachable in browser unit tests. */\n    if (!isServer) {\n      const preferences = getActivePreferences();\n      if (JSON.stringify(this.activePreferences) !== JSON.stringify(preferences)) {\n        this.activePreferences = preferences;\n      }\n    }\n  }\n\n  #setColorScheme(value: ColorScheme) {\n    this.value = { ...this.value, 'color-scheme': value };\n    this.#update();\n  }\n\n  #setScale(value: Scale) {\n    this.value = { ...this.value, scale: value };\n    this.#update();\n  }\n\n  #setReducedMotion(value: boolean) {\n    this.value = { ...this.value, 'reduced-motion': value };\n    this.#update();\n  }\n\n  #update() {\n    this.dispatchInputEvent();\n    this.dispatchChangeEvent();\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"preferences-input2.js","names":[],"sources":["../../src/preferences-input/preferences-input.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, isServer, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { I18nController, scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { state } from 'lit/decorators/state.js';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixins';\nimport { type IconName, Icon } from '@nvidia-elements/core/icon';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { Divider } from '@nvidia-elements/core/divider';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Switch } from '@nvidia-elements/core/switch';\nimport styles from './preferences-input.css?inline';\n\n/* eslint-disable jsdoc/no-types */\n// Explicit JSDoc types because the CEM analyzer loses the inherited generic specialization.\n\nexport type ColorScheme = 'auto' | 'light' | 'dark' | 'high-contrast';\nexport type Scale = 'default' | 'compact' | 'relaxed';\nexport type Variant = 'reduced-motion';\n\nconst colorSchemes: ColorScheme[] = ['auto', 'light', 'dark', 'high-contrast'];\nconst scales: Scale[] = ['default', 'compact'];\nconst colorSchemesIcons = {\n  auto: 'computer',\n  light: 'sun',\n  dark: 'moon',\n  'high-contrast': 'circle-half'\n} satisfies Record<ColorScheme, IconName>;\n\nfunction getActivePreferences(element = globalThis.document.documentElement) {\n  const computedStyle = getComputedStyle(element);\n\n  return {\n    light: computedStyle.getPropertyValue('--nve-config-color-scheme-light') === 'true',\n    dark: computedStyle.getPropertyValue('--nve-config-color-scheme-dark') === 'true',\n    'high-contrast': computedStyle.getPropertyValue('--nve-config-color-scheme-high-contrast') === 'true',\n    compact: computedStyle.getPropertyValue('--nve-config-scale-compact') === 'true',\n    'reduced-motion': computedStyle.getPropertyValue('--nve-config-reduced-motion') === 'true'\n  } satisfies Partial<Record<ColorScheme | Scale | Variant, boolean>>;\n}\n\nexport interface PreferencesInputValue {\n  'color-scheme'?: ColorScheme | string;\n  scale?: Scale | string;\n  'reduced-motion'?: boolean;\n}\n\n/**\n * @element nve-preferences-input\n * @description A preferences input is a widget for controlling apperance. Stylesheets register to the preferences input by including a css-property, see Standard for an example.\n * @documentation https://nvidia.github.io/elements/docs/elements/preferences-input/\n * @since 1.23.7\n * @entrypoint \\@nvidia-elements/core/preferences-input\n * @property {PreferencesInputValue} value - Contains the current color scheme, scale, and reduced motion preferences. Assign an object through JavaScript or provide its JSON serialization in the HTML `value` attribute.\n * @attribute {string} value - JSON object parsed as `PreferencesInputValue`.\n * @event input - Dispatched when the value has changed\n * @event change - Dispatched when the value has changed\n * @cssprop --color\n * @cssprop --width\n * @csspart control - The control wrapper elements that contain the labels and menus\n * @csspart menu - The menu elements that display color scheme and scale options\n * @csspart menu-item - The individual menu item elements for each selectable option\n * @csspart icon - The icon element displayed next to color scheme options\n * @csspart divider - The divider elements that separate preference sections\n * @csspart switch - The switch element for the reduced motion toggle\n *\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/listbox/\n *\n */\n@scopedRegistry()\nexport class PreferencesInput extends FormControlMixin<typeof LitElement, PreferencesInputValue>(LitElement) {\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /**\n   * Enables updating internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-preferences-input',\n    version: '0.0.0',\n    valueSchema: {\n      type: 'object' as const,\n      properties: {\n        'color-scheme': { type: 'string' as const },\n        scale: { type: 'string' as const },\n        'reduced-motion': { type: 'boolean' as const }\n      }\n    }\n  };\n\n  static elementDefinitions = {\n    [Control.metadata.tag]: Control,\n    [Divider.metadata.tag]: Divider,\n    [Icon.metadata.tag]: Icon,\n    [Menu.metadata.tag]: Menu,\n    [MenuItem.metadata.tag]: MenuItem,\n    [Switch.metadata.tag]: Switch\n  };\n\n  @state() private activePreferences: ReturnType<typeof getActivePreferences> = {\n    light: false,\n    dark: false,\n    'high-contrast': false,\n    compact: false,\n    'reduced-motion': false\n  };\n\n  // eslint-disable-next-line max-lines-per-function\n  render() {\n    return html`\n      <div internal-host>\n        <nve-control part=\"control\">\n          <label>${this.i18n.colorScheme}</label>\n          <nve-menu part=\"menu\" nve-control>\n          ${colorSchemes.map(\n            value => html`\n            <nve-menu-item part=\"menu-item\"\n              .selected=${this.value?.['color-scheme'] === value}\n              .value=${value}\n              @click=${() => this.#setColorScheme(value)}\n            >\n              <nve-icon part=\"icon\" name=${colorSchemesIcons[value]}></nve-icon> ${value}\n            </nve-menu-item>\n            `\n          )}\n          </nve-menu>\n        </nve-control>\n        ${\n          this.activePreferences['compact']\n            ? html`\n        <nve-divider part=\"divider\"></nve-divider>\n        <nve-control part=\"control\">\n          <label>${this.i18n.scale}</label>\n          <nve-menu part=\"menu\" nve-control>\n          ${scales.map(\n            value => html`\n            <nve-menu-item part=\"menu-item\"\n              .selected=${this.value?.['scale'] === value}\n              .value=${value}\n              @click=${() => this.#setScale(value)}\n            >\n              ${value}\n            </nve-menu-item>\n            `\n          )}\n          </nve-menu>\n        </nve-control>\n          `\n            : ''\n        }\n        ${\n          this.activePreferences['reduced-motion']\n            ? html`\n        <nve-divider part=\"divider\"></nve-divider>\n        <nve-switch part=\"switch\">\n          <label>${this.i18n.reducedMotion}</label>\n          <input\n            type=\"checkbox\"\n            value=\"reduced-motion\"\n            .checked=${this.value?.['reduced-motion']}\n            @change=${(e: { target: HTMLInputElement }) => this.#setReducedMotion(e.target.checked)}\n          />\n        </nve-switch>`\n            : ''\n        }\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.value = {\n      'color-scheme': 'auto',\n      'reduced-motion': false,\n      scale: 'default'\n    };\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('nve-control', '');\n    this.#updatePreferences();\n  }\n\n  /** @private */\n  updateValue(value: PreferencesInputValue) {\n    super.updateValue({ ...this.value, ...value });\n    this.#updatePreferences();\n  }\n\n  #updatePreferences() {\n    /* istanbul ignore else -- Lit SSR mode is not reachable in browser unit tests. */\n    if (!isServer) {\n      const preferences = getActivePreferences();\n      if (JSON.stringify(this.activePreferences) !== JSON.stringify(preferences)) {\n        this.activePreferences = preferences;\n      }\n    }\n  }\n\n  #setColorScheme(value: ColorScheme) {\n    this.value = { ...this.value, 'color-scheme': value };\n    this.#update();\n  }\n\n  #setScale(value: Scale) {\n    this.value = { ...this.value, scale: value };\n    this.#update();\n  }\n\n  #setReducedMotion(value: boolean) {\n    this.value = { ...this.value, 'reduced-motion': value };\n    this.#update();\n  }\n\n  #update() {\n    this.dispatchInputEvent();\n    this.dispatchChangeEvent();\n  }\n}\n"],"mappings":"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"}

package/dist/progress-bar/progress-bar2.js

@@ -1,6 +1,6 @@
 import { scopedRegistry as e } from "../internal/decorators/scoped-registry.js";
 import { useStyles as t } from "../internal/styles/index.js";
-import n from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
+import n from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import r from "./progress-bar.js";
 import { LitElement as i, html as a } from "lit";
 import { property as o } from "lit/decorators/property.js";
@@ -16,7 +16,7 @@ var c = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-progress-bar",
-			version: "2.7.2"
+			version: "2.8.0"
 		};
 	}
 	render() {

package/dist/progress-bar/progress-bar2.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-bar2.js","names":[],"sources":["../../src/progress-bar/progress-bar.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 type { SupportStatus } from '@nvidia-elements/core/internal';\nimport { scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { property } from 'lit/decorators/property.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport styles from './progress-bar.css?inline';\n\n/**\n * @element nve-progress-bar\n * @description A progress bar is a visual indicator of the status of a running task. Under the hood, the component uses the native HTML `progress` element to achieve proper a11y concerns.\n * @documentation https://nvidia.github.io/elements/docs/elements/progress-bar/\n * @since 0.16.0\n * @entrypoint \\@nvidia-elements/core/progress-bar\n * @cssprop --height\n * @cssprop --opacity\n * @cssprop --background\n * @cssprop --accent-color\n * @cssprop --indeterminate-gradient - Gradient used for indeterminate state animation\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role\n */\n@scopedRegistry()\nexport class ProgressBar extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-progress-bar',\n    version: '0.0.0'\n  };\n\n  /** The current `value` of the progress indicator, set to the native HTML progress element. */\n  @property({ type: Number, reflect: true }) value?: number;\n\n  /** The `max` property sets the highest value that `value` scales to. */\n  @property({ type: Number }) max? = 100;\n\n  /** Defines visual treatment to represent a ongoing task or support status. */\n  @property({ type: String, reflect: true }) status: SupportStatus;\n\n  render() {\n    const classes = {\n      full: this.value === this.max,\n      'min-width': this.value !== undefined && this.value > 0,\n      indeterminate: this.value === undefined\n    };\n\n    return html`\n      <progress internal-host .max=${this.max as number} .value=${this.value === undefined ? (100 as number) : (this.value as number)} class=${classMap(classes)}></progress>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;AAwBO,IAAA,IAAA,cAA0B,EAAW;;0BAYP;;;gBAXnB,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;EACX;;CAWA,SAAS;EACP,IAAM,IAAU;GACd,MAAM,KAAK,UAAU,KAAK;GAC1B,aAAa,KAAK,UAAU,KAAA,KAAa,KAAK,QAAQ;GACtD,eAAe,KAAK,UAAU,KAAA;EAChC;EAEA,OAAO,CAAI,iCACsB,KAAK,IAAc,YAAU,KAAK,UAAU,KAAA,IAAa,MAAkB,KAAK,MAAiB,WAAS,EAAS,CAAO,EAAE;CAE/J;AACF;GAnBG,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,MAGxC,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,OAAA,KAAA,CAAA,MAGzB,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,UAhB1C,EAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"progress-bar2.js","names":[],"sources":["../../src/progress-bar/progress-bar.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 type { SupportStatus } from '@nvidia-elements/core/internal';\nimport { scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { property } from 'lit/decorators/property.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport styles from './progress-bar.css?inline';\n\n/**\n * @element nve-progress-bar\n * @description A progress bar is a visual indicator of the status of a running task. Under the hood, the component uses the native HTML `progress` element to achieve proper a11y concerns.\n * @documentation https://nvidia.github.io/elements/docs/elements/progress-bar/\n * @since 0.16.0\n * @entrypoint \\@nvidia-elements/core/progress-bar\n * @cssprop --height\n * @cssprop --opacity\n * @cssprop --background\n * @cssprop --accent-color\n * @cssprop --indeterminate-gradient - Gradient used for indeterminate state animation\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role\n */\n@scopedRegistry()\nexport class ProgressBar extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-progress-bar',\n    version: '0.0.0'\n  };\n\n  /** The current `value` of the progress indicator, set to the native HTML progress element. */\n  @property({ type: Number, reflect: true }) value?: number;\n\n  /** The `max` property sets the highest value that `value` scales to. */\n  @property({ type: Number }) max? = 100;\n\n  /** Defines visual treatment to represent a ongoing task or support status. */\n  @property({ type: String, reflect: true }) status: SupportStatus;\n\n  render() {\n    const classes = {\n      full: this.value === this.max,\n      'min-width': this.value !== undefined && this.value > 0,\n      indeterminate: this.value === undefined\n    };\n\n    return html`\n      <progress internal-host .max=${this.max as number} .value=${this.value === undefined ? (100 as number) : (this.value as number)} class=${classMap(classes)}></progress>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;AAwBO,IAAM,IAAN,cAA0B,EAAW;;EAYP,aAAA,KAAA,MAAA;;;EAXnB,KAAA,SAAA,EAAU,CAAC,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAWA,SAAS;EACP,IAAM,IAAU;GACd,MAAM,KAAK,UAAU,KAAK;GAC1B,aAAa,KAAK,UAAU,KAAA,KAAa,KAAK,QAAQ;GACtD,eAAe,KAAK,UAAU,KAAA;EAChC;EAEA,OAAO,CAAI,iCACsB,KAAK,IAAc,YAAU,KAAK,UAAU,KAAA,IAAa,MAAkB,KAAK,MAAiB,WAAS,EAAS,CAAO,EAAE;CAE/J;AACF;AAnBG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,OAAA,KAAA,CAAA,GAGzB,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAhB1C,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}

package/dist/progress-ring/progress-ring.js

@@ -1,5 +1,5 @@
 //#region src/progress-ring/progress-ring.css?inline
-var e = ":host{--background-color: var(--nve-sys-interaction-background);--ring-color: var(--nve-sys-accent-secondary-background);--ring-background-opacity: 1;--ring-width: 2px;--width: var(--nve-ref-size-800);--height: var(--nve-ref-size-800);--animation-duration: calc(var(--nve-ref-animation-duration-400) * 2.5);width:var(--width);height:var(--height);container-type:size}:host([size=\"xxs\"]){--ring-width: 3px;--width: var(--nve-ref-size-300);--height: var(--nve-ref-size-300)}:host([size=\"xs\"]){--ring-width: 3px;--width: var(--nve-ref-size-400);--height: var(--nve-ref-size-400)}:host([size=\"sm\"]){--ring-width: 2.5px;--width: var(--nve-ref-size-600);--height: var(--nve-ref-size-600)}:host([size=\"lg\"]){--width: var(--nve-ref-size-1000);--height: var(--nve-ref-size-1000)}:host([size=\"xl\"]){--ring-width: 1px;--width: calc(2 * var(--nve-ref-space-xxxl));--height: calc(2 * var(--nve-ref-space-xxxl))}[internal-host]{display:flex;place-items:center;place-content:center;height:100%}svg{position:absolute;top:0;left:0;width:100%;height:100%}circle.background{fill:var(--background-color);opacity:var(--ring-background-opacity);stroke:none}circle.ring{fill:none;stroke:var(--ring-color);stroke-width:var(--ring-width);stroke-linecap:round;transform-origin:50% 50%;transform:rotate(-90deg);transition:all .2s ease-in-out 0s}:host([status=\"success\"]){--ring-color: var(--nve-sys-support-success-emphasis-color);--background-color: var(--nve-sys-support-success-muted-color)}:host([status=\"warning\"]){--ring-color: var(--nve-sys-support-warning-emphasis-color);--background-color: var(--nve-sys-support-warning-muted-color)}:host([status=\"danger\"]){--ring-color: var(--nve-sys-support-danger-emphasis-color);--background-color: var(--nve-sys-support-danger-muted-color)}:host([status=\"neutral\"]){--ring-background-opacity: .5;--ring-color: var(--color, var(--nve-sys-interaction-color));--background-color: var(--color, var(--nve-sys-interaction-color))}:host([status=\"accent\"]) [internal-host]:not([indeterminate]) circle.background{stroke:var(--background-color);fill:none;stroke-width:var(--ring-width)}:host([status=\"accent\"]) [internal-host][indeterminate] circle.background{display:none}:host([status=\"neutral\"]) [internal-host]:not([indeterminate]) circle.background{stroke:var(--background-color);fill:none;stroke-width:var(--ring-width)}:host([status=\"neutral\"]) [internal-host][indeterminate] circle.background{display:none}[internal-host][indeterminate] circle.ring{animation:var(--animation-duration) linear 0s infinite normal none running spin-infinite}::slotted(nve-icon),nve-icon{--width: 50cqw;--height: 50cqh;--color: var(--ring-color)}@keyframes spin-infinite{0%{stroke-dasharray:.01px,43.97px;transform:rotate(0)}50%{stroke-dasharray:21.99px,21.99px;transform:rotate(450deg)}to{stroke-dasharray:.01px,43.97px;transform:rotate(1080deg)}}";
+var e = ":host{--background-color: var(--nve-sys-interaction-background);--ring-color: var(--nve-sys-accent-secondary-background);--ring-background-opacity: 1;--ring-width: 2px;--width: var(--nve-ref-size-800);--height: var(--nve-ref-size-800);--animation-duration: calc(var(--nve-ref-animation-duration-400) * 2.5);width:var(--width);height:var(--height);container-type:size}:host([size=\"xxs\"]){--ring-width: 3px;--width: var(--nve-ref-size-300);--height: var(--nve-ref-size-300)}:host([size=\"xs\"]){--ring-width: 3px;--width: var(--nve-ref-size-400);--height: var(--nve-ref-size-400)}:host([size=\"sm\"]){--ring-width: 2.5px;--width: var(--nve-ref-size-600);--height: var(--nve-ref-size-600)}:host([size=\"lg\"]){--width: var(--nve-ref-size-1000);--height: var(--nve-ref-size-1000)}:host([size=\"xl\"]){--ring-width: 1px;--width: calc(2 * var(--nve-ref-space-xxxl));--height: calc(2 * var(--nve-ref-space-xxxl))}[internal-host]{display:flex;place-items:center;place-content:center;height:100%}svg{position:absolute;top:0;left:0;width:100%;height:100%}circle.background{fill:var(--background-color);opacity:var(--ring-background-opacity);stroke:none}circle.progress-ring-circle{fill:none;stroke:var(--ring-color);stroke-width:var(--ring-width);stroke-linecap:round;transform-origin:50% 50%;transform:rotate(-90deg);transition:all .2s ease-in-out 0s}:host([status=\"success\"]){--ring-color: var(--nve-sys-support-success-emphasis-color);--background-color: var(--nve-sys-support-success-muted-color)}:host([status=\"warning\"]){--ring-color: var(--nve-sys-support-warning-emphasis-color);--background-color: var(--nve-sys-support-warning-muted-color)}:host([status=\"danger\"]){--ring-color: var(--nve-sys-support-danger-emphasis-color);--background-color: var(--nve-sys-support-danger-muted-color)}:host([status=\"neutral\"]){--ring-background-opacity: .5;--ring-color: var(--color, var(--nve-sys-interaction-color));--background-color: var(--color, var(--nve-sys-interaction-color))}:host([status=\"accent\"]) [internal-host]:not([indeterminate]) circle.background{stroke:var(--background-color);fill:none;stroke-width:var(--ring-width)}:host([status=\"accent\"]) [internal-host][indeterminate] circle.background{display:none}:host([status=\"neutral\"]) [internal-host]:not([indeterminate]) circle.background{stroke:var(--background-color);fill:none;stroke-width:var(--ring-width)}:host([status=\"neutral\"]) [internal-host][indeterminate] circle.background{display:none}[internal-host][indeterminate] circle.progress-ring-circle{animation:var(--animation-duration) linear 0s infinite normal none running spin-infinite}::slotted(nve-icon),nve-icon{--width: 50cqw;--height: 50cqh;--color: var(--ring-color)}@keyframes spin-infinite{0%{stroke-dasharray:.01px,43.97px;transform:rotate(0)}50%{stroke-dasharray:21.99px,21.99px;transform:rotate(450deg)}to{stroke-dasharray:.01px,43.97px;transform:rotate(1080deg)}}";
 //#endregion
 export { e as default };
 

package/dist/progress-ring/progress-ring.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-ring.js","names":[],"sources":["../../src/progress-ring/progress-ring.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --background-color: var(--nve-sys-interaction-background);\n  --ring-color: var(--nve-sys-accent-secondary-background);\n  --ring-background-opacity: 1;\n  --ring-width: 2px;\n  --width: var(--nve-ref-size-800);\n  --height: var(--nve-ref-size-800);\n  --animation-duration: calc(var(--nve-ref-animation-duration-400) * 2.5);\n\n  width: var(--width);\n  height: var(--height);\n  container-type: size;\n}\n\n:host([size='xxs']) {\n  --ring-width: 3px;\n  --width: var(--nve-ref-size-300);\n  --height: var(--nve-ref-size-300);\n}\n\n:host([size='xs']) {\n  --ring-width: 3px;\n  --width: var(--nve-ref-size-400);\n  --height: var(--nve-ref-size-400);\n}\n\n:host([size='sm']) {\n  --ring-width: 2.5px;\n  --width: var(--nve-ref-size-600);\n  --height: var(--nve-ref-size-600);\n}\n\n:host([size='lg']) {\n  --width: var(--nve-ref-size-1000);\n  --height: var(--nve-ref-size-1000);\n}\n\n:host([size='xl']) {\n  --ring-width: 1px;\n  --width: calc(2 * var(--nve-ref-space-xxxl));\n  --height: calc(2 * var(--nve-ref-space-xxxl));\n}\n\n[internal-host] {\n  display: flex;\n  place-items: center;\n  place-content: center;\n  height: 100%;\n}\n\nsvg {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\ncircle.background {\n  fill: var(--background-color);\n  opacity: var(--ring-background-opacity);\n  stroke: none;\n}\n\ncircle.ring {\n  fill: none;\n  stroke: var(--ring-color);\n  stroke-width: var(--ring-width);\n  stroke-linecap: round;\n  transform-origin: 50% 50%;\n  transform: rotate(-90deg);\n  transition: all 0.2s ease-in-out 0s;\n}\n\n:host([status='success']) {\n  --ring-color: var(--nve-sys-support-success-emphasis-color);\n  --background-color: var(--nve-sys-support-success-muted-color);\n}\n\n:host([status='warning']) {\n  --ring-color: var(--nve-sys-support-warning-emphasis-color);\n  --background-color: var(--nve-sys-support-warning-muted-color);\n}\n\n:host([status='danger']) {\n  --ring-color: var(--nve-sys-support-danger-emphasis-color);\n  --background-color: var(--nve-sys-support-danger-muted-color);\n}\n\n:host([status='neutral']) {\n  --ring-background-opacity: 0.5;\n  --ring-color: var(--color, var(--nve-sys-interaction-color));\n  --background-color: var(--color, var(--nve-sys-interaction-color));\n}\n\n:host([status='accent']) [internal-host]:not([indeterminate]) circle.background {\n  stroke: var(--background-color);\n  fill: none;\n  stroke-width: var(--ring-width);\n}\n\n:host([status='accent']) [internal-host][indeterminate] circle.background {\n  display: none;\n}\n\n:host([status='neutral']) [internal-host]:not([indeterminate]) circle.background {\n  stroke: var(--background-color);\n  fill: none;\n  stroke-width: var(--ring-width);\n}\n\n:host([status='neutral']) [internal-host][indeterminate] circle.background {\n  display: none;\n}\n\n[internal-host][indeterminate] circle.ring {\n  animation: var(--animation-duration) linear 0s infinite normal none running spin-infinite;\n}\n\n::slotted(nve-icon),\nnve-icon {\n  --width: 50cqw;\n  --height: 50cqh;\n  --color: var(--ring-color);\n}\n\n@keyframes spin-infinite {\n  0% {\n    stroke-dasharray: 0.01px, 43.97px;\n    transform: rotate(0deg);\n  }\n\n  50% {\n    stroke-dasharray: 21.99px, 21.99px;\n    transform: rotate(450deg);\n  }\n\n  100% {\n    stroke-dasharray: 0.01px, 43.97px;\n    transform: rotate(1080deg);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"progress-ring.js","names":[],"sources":["../../src/progress-ring/progress-ring.css?inline"],"sourcesContent":["/* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved. */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:host {\n  --background-color: var(--nve-sys-interaction-background);\n  --ring-color: var(--nve-sys-accent-secondary-background);\n  --ring-background-opacity: 1;\n  --ring-width: 2px;\n  --width: var(--nve-ref-size-800);\n  --height: var(--nve-ref-size-800);\n  --animation-duration: calc(var(--nve-ref-animation-duration-400) * 2.5);\n\n  width: var(--width);\n  height: var(--height);\n  container-type: size;\n}\n\n:host([size='xxs']) {\n  --ring-width: 3px;\n  --width: var(--nve-ref-size-300);\n  --height: var(--nve-ref-size-300);\n}\n\n:host([size='xs']) {\n  --ring-width: 3px;\n  --width: var(--nve-ref-size-400);\n  --height: var(--nve-ref-size-400);\n}\n\n:host([size='sm']) {\n  --ring-width: 2.5px;\n  --width: var(--nve-ref-size-600);\n  --height: var(--nve-ref-size-600);\n}\n\n:host([size='lg']) {\n  --width: var(--nve-ref-size-1000);\n  --height: var(--nve-ref-size-1000);\n}\n\n:host([size='xl']) {\n  --ring-width: 1px;\n  --width: calc(2 * var(--nve-ref-space-xxxl));\n  --height: calc(2 * var(--nve-ref-space-xxxl));\n}\n\n[internal-host] {\n  display: flex;\n  place-items: center;\n  place-content: center;\n  height: 100%;\n}\n\nsvg {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\ncircle.background {\n  fill: var(--background-color);\n  opacity: var(--ring-background-opacity);\n  stroke: none;\n}\n\ncircle.progress-ring-circle {\n  fill: none;\n  stroke: var(--ring-color);\n  stroke-width: var(--ring-width);\n  stroke-linecap: round;\n  transform-origin: 50% 50%;\n  transform: rotate(-90deg);\n  transition: all 0.2s ease-in-out 0s;\n}\n\n:host([status='success']) {\n  --ring-color: var(--nve-sys-support-success-emphasis-color);\n  --background-color: var(--nve-sys-support-success-muted-color);\n}\n\n:host([status='warning']) {\n  --ring-color: var(--nve-sys-support-warning-emphasis-color);\n  --background-color: var(--nve-sys-support-warning-muted-color);\n}\n\n:host([status='danger']) {\n  --ring-color: var(--nve-sys-support-danger-emphasis-color);\n  --background-color: var(--nve-sys-support-danger-muted-color);\n}\n\n:host([status='neutral']) {\n  --ring-background-opacity: 0.5;\n  --ring-color: var(--color, var(--nve-sys-interaction-color));\n  --background-color: var(--color, var(--nve-sys-interaction-color));\n}\n\n:host([status='accent']) [internal-host]:not([indeterminate]) circle.background {\n  stroke: var(--background-color);\n  fill: none;\n  stroke-width: var(--ring-width);\n}\n\n:host([status='accent']) [internal-host][indeterminate] circle.background {\n  display: none;\n}\n\n:host([status='neutral']) [internal-host]:not([indeterminate]) circle.background {\n  stroke: var(--background-color);\n  fill: none;\n  stroke-width: var(--ring-width);\n}\n\n:host([status='neutral']) [internal-host][indeterminate] circle.background {\n  display: none;\n}\n\n[internal-host][indeterminate] circle.progress-ring-circle {\n  animation: var(--animation-duration) linear 0s infinite normal none running spin-infinite;\n}\n\n::slotted(nve-icon),\nnve-icon {\n  --width: 50cqw;\n  --height: 50cqh;\n  --color: var(--ring-color);\n}\n\n@keyframes spin-infinite {\n  0% {\n    stroke-dasharray: 0.01px, 43.97px;\n    transform: rotate(0deg);\n  }\n\n  50% {\n    stroke-dasharray: 21.99px, 21.99px;\n    transform: rotate(450deg);\n  }\n\n  100% {\n    stroke-dasharray: 0.01px, 43.97px;\n    transform: rotate(1080deg);\n  }\n}\n"],"mappings":""}

package/dist/progress-ring/progress-ring2.js

@@ -3,7 +3,7 @@ import { attachInternals as t } from "../internal/utils/a11y.js";
 import { scopedRegistry as n } from "../internal/decorators/scoped-registry.js";
 import { useStyles as r } from "../internal/styles/index.js";
 import { statusIcons as i } from "../internal/types/index.js";
-import a from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
+import a from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import { Icon as o } from "../icon/icon2.js";
 import s from "./progress-ring.js";
 import { LitElement as c, html as l } from "lit";
@@ -19,7 +19,7 @@ var d = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-progress-ring",
-			version: "2.7.2"
+			version: "2.8.0"
 		};
 	}
 	static {
@@ -27,7 +27,7 @@ var d = class extends c {
 	}
 	#e;
 	render() {
-		return l`<div internal-host ?indeterminate="${this.value === void 0}"><svg viewBox="0 0 16 16" role="presentation"><circle cx="8px" cy="8px" r="6.5px" class="background"></circle><circle cx="8px" cy="8px" r="6.5px" class="ring" stroke-dasharray="${`${(this.value ?? 0) / (this.max ?? 100) * 44}px 44px`}"></circle></svg><slot>${this.status === "accent" ? "" : l`<nve-icon part="icon" .name="${this.status ? i[this.status] : void 0}" .status="${this.status}" aria-hidden="true"></nve-icon>`}</slot></div>`;
+		return l`<div internal-host ?indeterminate="${this.value === void 0}"><svg viewBox="0 0 16 16" role="presentation"><circle cx="8px" cy="8px" r="6.5px" class="background"></circle><circle cx="8px" cy="8px" r="6.5px" class="progress-ring-circle" stroke-dasharray="${`${(this.value ?? 0) / (this.max ?? 100) * 44}px 44px`}"></circle></svg><slot>${this.status === "accent" ? "" : l`<nve-icon part="icon" .name="${this.status ? i[this.status] : void 0}" .status="${this.status}" aria-hidden="true"></nve-icon>`}</slot></div>`;
 	}
 	connectedCallback() {
 		super.connectedCallback(), t(this), this._internals.role = "progressbar";

package/dist/progress-ring/progress-ring2.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-ring2.js","names":["#i18nController"],"sources":["../../src/progress-ring/progress-ring.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 type { Size, SupportStatus } from '@nvidia-elements/core/internal';\nimport {\n  attachInternals,\n  I18nController,\n  scopedRegistry,\n  statusIcons,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './progress-ring.css?inline';\n\n/**\n * @element nve-progress-ring\n * @description The `progress-ring` component shows the status of a pending task. It also serves the basis of the page loading element.\n * @documentation https://nvidia.github.io/elements/docs/elements/progress-ring/\n * @since 0.17.0\n * @entrypoint \\@nvidia-elements/core/progress-ring\n * @slot - Content to display in the ring center. Defaults to a status icon.\n * @cssprop --background-color\n * @cssprop --ring-color\n * @cssprop --ring-background-opacity\n * @cssprop --ring-width\n * @cssprop --width\n * @cssprop --height\n * @cssprop --animation-duration\n * @cssprop --color\n * @csspart icon - The icon element\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role\n */\n@scopedRegistry()\nexport class ProgressRing extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-progress-ring',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  /** The current `value` of the progress ring. When not set, an indeterminate animation will show. */\n  @property({ type: Number }) value?: number;\n\n  /** The `max` value of the progress ring that the `value` is proportionally scaled to. */\n  @property({ type: Number }) max? = 100;\n\n  /** Four visual treatments represent the `status` of tasks. When `status` changes to `warning`, `success`, or `danger`, the component embeds appropriate icons. */\n  @property({ type: String, reflect: true }) status?: SupportStatus | 'neutral' = 'neutral';\n\n  /** T-shirt `size` of the progress indicator, used to scale the ring. */\n  @property({ type: String, reflect: true }) size?: Size | 'xxs' | 'xs' | 'xl';\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  render() {\n    return html`\n      <div internal-host ?indeterminate=${this.value === undefined}>\n        <svg viewBox=\"0 0 16 16\" role=\"presentation\">\n          <circle cx=\"8px\" cy=\"8px\" r=\"6.5px\" class=\"background\"></circle>\n          <circle cx=\"8px\" cy=\"8px\" r=\"6.5px\" class=\"ring\"\n            stroke-dasharray=${`${((this.value ?? 0) / (this.max ?? 100)) * 44}px 44px`}>\n          </circle>\n        </svg>\n        <slot>\n          ${\n            this.status !== 'accent'\n              ? html`<nve-icon part=\"icon\" .name=${this.status ? statusIcons[this.status] : undefined} .status=${this.status as SupportStatus} aria-hidden=\"true\"></nve-icon>`\n              : ''\n          }\n        </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    this._internals.ariaValueNow = `${this.value === undefined ? '' : this.value}`;\n    this._internals.ariaValueMax = `${this.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"],"mappings":";;;;;;;;;;;AAoCO,IAAA,IAAA,cAA2B,EAAW;;0BAmBR,mBAG6C,qBAKxC,IAAI,EAAqB,IAAI,eAGlC,KAAKA,GAAgB;;;gBA7BxC,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;EACX;;;4BAE4B,GACzB,EAAK,SAAS,MAAM,EACvB;;CAiBA;CAKA,SAAS;EACP,OAAO,CAAI,sCAC2B,KAAK,UAAU,KAAA,EAAU,oLAIpC,IAAK,KAAK,SAAS,MAAM,KAAK,OAAO,OAAQ,GAAG,SAAS,yBAK5E,KAAK,WAAW,WAEZ,KADA,CAAI,gCAA+B,KAAK,SAAS,EAAY,KAAK,UAAU,KAAA,EAAU,aAAW,KAAK,OAAwB,kCAEnI;CAIT;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO;CACzB;CAEA,QAAQ,GAA6B;EAGnC,AAFA,MAAM,QAAQ,CAAK,GACnB,KAAK,WAAW,eAAe,GAAG,KAAK,UAAU,KAAA,IAAY,KAAK,KAAK,SACvE,KAAK,WAAW,eAAe,GAAG,KAAK;EACvC,IAAM,EAAE,cAAW,MACb,IACJ,MAAW,KAAA,KAAa,MAAW,aAAa,MAAW,WAAW,KAAK,KAAK,KAAU,KAAA;EAC5F,KAAK,WAAW,YAAY,KAAe,KAAK,KAAK,eAAe;CACtE;AACF;GAnDG,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,MAGzB,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,OAAA,KAAA,CAAA,MAGzB,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,MAGxC,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MAKxC,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,UA/B3B,EAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"progress-ring2.js","names":[],"sources":["../../src/progress-ring/progress-ring.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 type { Size, SupportStatus } from '@nvidia-elements/core/internal';\nimport {\n  attachInternals,\n  I18nController,\n  scopedRegistry,\n  statusIcons,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './progress-ring.css?inline';\n\n/**\n * @element nve-progress-ring\n * @description The `progress-ring` component shows the status of a pending task. It also serves the basis of the page loading element.\n * @documentation https://nvidia.github.io/elements/docs/elements/progress-ring/\n * @since 0.17.0\n * @entrypoint \\@nvidia-elements/core/progress-ring\n * @slot - Content to display in the ring center. Defaults to a status icon.\n * @cssprop --background-color\n * @cssprop --ring-color\n * @cssprop --ring-background-opacity\n * @cssprop --ring-width\n * @cssprop --width\n * @cssprop --height\n * @cssprop --animation-duration\n * @cssprop --color\n * @csspart icon - The icon element\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role\n */\n@scopedRegistry()\nexport class ProgressRing extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-progress-ring',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  /** The current `value` of the progress ring. When not set, an indeterminate animation will show. */\n  @property({ type: Number }) value?: number;\n\n  /** The `max` value of the progress ring that the `value` is proportionally scaled to. */\n  @property({ type: Number }) max? = 100;\n\n  /** Four visual treatments represent the `status` of tasks. When `status` changes to `warning`, `success`, or `danger`, the component embeds appropriate icons. */\n  @property({ type: String, reflect: true }) status?: SupportStatus | 'neutral' = 'neutral';\n\n  /** T-shirt `size` of the progress indicator, used to scale the ring. */\n  @property({ type: String, reflect: true }) size?: Size | 'xxs' | 'xs' | 'xl';\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  render() {\n    return html`\n      <div internal-host ?indeterminate=${this.value === undefined}>\n        <svg viewBox=\"0 0 16 16\" role=\"presentation\">\n          <circle cx=\"8px\" cy=\"8px\" r=\"6.5px\" class=\"background\"></circle>\n          <circle cx=\"8px\" cy=\"8px\" r=\"6.5px\" class=\"progress-ring-circle\"\n            stroke-dasharray=${`${((this.value ?? 0) / (this.max ?? 100)) * 44}px 44px`}>\n          </circle>\n        </svg>\n        <slot>\n          ${\n            this.status !== 'accent'\n              ? html`<nve-icon part=\"icon\" .name=${this.status ? statusIcons[this.status] : undefined} .status=${this.status as SupportStatus} aria-hidden=\"true\"></nve-icon>`\n              : ''\n          }\n        </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    this._internals.ariaValueNow = `${this.value === undefined ? '' : this.value}`;\n    this._internals.ariaValueMax = `${this.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"],"mappings":";;;;;;;;;;;AAoCO,IAAM,IAAN,cAA2B,EAAW;;EA8BR,aAXA,KAAA,MAAA,KAG6C,KAAA,SAAA,WAKxC,KAAA,KAAA,IAAI,EAAqB,IAAI,GAGlC,KAAA,OAAA,KAAK,GAAgB;;;EA7BxC,KAAA,SAAA,EAAU,CAAC,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAK,SAAS,MAAM,EACvB;;CAiBA;CAKA,SAAS;EACP,OAAO,CAAI,sCAC2B,KAAK,UAAU,KAAA,EAAU,oMAIpC,IAAK,KAAK,SAAS,MAAM,KAAK,OAAO,OAAQ,GAAG,SAAS,yBAK5E,KAAK,WAAW,WAEZ,KADA,CAAI,gCAA+B,KAAK,SAAS,EAAY,KAAK,UAAU,KAAA,EAAU,aAAW,KAAK,OAAwB,kCAEnI;CAIT;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO;CACzB;CAEA,QAAQ,GAA6B;EAGnC,AAFA,MAAM,QAAQ,CAAK,GACnB,KAAK,WAAW,eAAe,GAAG,KAAK,UAAU,KAAA,IAAY,KAAK,KAAK,SACvE,KAAK,WAAW,eAAe,GAAG,KAAK;EACvC,IAAM,EAAE,cAAW,MACb,IACJ,MAAW,KAAA,KAAa,MAAW,aAAa,MAAW,WAAW,KAAK,KAAK,KAAU,KAAA;EAC5F,KAAK,WAAW,YAAY,KAAe,KAAK,KAAK,eAAe;CACtE;AACF;AAnDG,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,GAGzB,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,OAAA,KAAA,CAAA,GAGzB,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GA/B3B,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}

package/dist/progressive-filter-chip/progressive-filter-chip2.js

@@ -5,7 +5,7 @@ import { TypeClosableController as i } from "../internal/controllers/type-closab
 import { typeSSR as a } from "../internal/controllers/type-ssr.controller.js";
 import { scopedRegistry as o } from "../internal/decorators/scoped-registry.js";
 import { useStyles as s } from "../internal/styles/index.js";
-import c from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
+import c from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import { IconButton as l } from "../icon-button/icon-button2.js";
 import { Input as u } from "../input/input2.js";
 import { Select as d } from "../select/select2.js";
@@ -23,7 +23,7 @@ var b = class extends h {
 	static {
 		this.metadata = {
 			tag: "nve-progressive-filter-chip",
-			version: "2.7.2"
+			version: "2.8.0"
 		};
 	}
 	static {

package/dist/progressive-filter-chip/progressive-filter-chip2.js.map

@@ -1 +1 @@
-{"version":3,"file":"progressive-filter-chip2.js","names":["#i18nController","#removeItem","#getControlTemplate","#typeClosableController","#createItems","#resetItems"],"sources":["../../src/progressive-filter-chip/progressive-filter-chip.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport {\n  appendRootNodeStyle,\n  attachInternals,\n  generateId,\n  I18nController,\n  scopedRegistry,\n  TypeClosableController,\n  typeSSR,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { Input } from '@nvidia-elements/core/input';\nimport { Select } from '@nvidia-elements/core/select';\nimport { Date } from '@nvidia-elements/core/date';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport globalStyles from './progressive-filter-chip.global.css?inline';\nimport styles from './progressive-filter-chip.css?inline';\n\n/**\n * @element nve-progressive-filter-chip\n * @description A filter chip is a control that enables users to select many options from a set of choices.\n * @documentation https://nvidia.github.io/elements/docs/elements/progressive-filter-chip/\n * @since 0.16.0\n * @entrypoint \\@nvidia-elements/core/progressive-filter-chip\n * @slot - `input`, `select`, `nve-button`, or other `[nve-control]` elements used to build the filter.\n * @event close - Dispatched when the filter chip closes.\n * @cssprop --gap\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --background\n * @cssprop --font-weight\n * @cssprop --padding\n * @cssprop --width\n * @csspart select - The select element\n * @csspart date - The date input element\n * @csspart input - The input element\n * @csspart icon-button - The icon button element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/\n */\n@typeSSR()\n@scopedRegistry()\nexport class ProgressiveFilterChip extends LitElement {\n  static readonly metadata = {\n    tag: 'nve-progressive-filter-chip',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Input.metadata.tag]: Input,\n    [Select.metadata.tag]: Select,\n    [Date.metadata.tag]: Date,\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  /** Determines if a close button should render within filter chip */\n  @property({ type: Boolean }) closable: boolean;\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  @state() private inputs: Element[] = [];\n\n  static styles = useStyles([styles]);\n\n  #typeClosableController = new TypeClosableController(this);\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #getControlTemplate(el: Element) {\n    const slot = html`<slot name=${el.slot} @slotchange=${this.#removeItem}></slot>`;\n    if (el.tagName === 'SELECT') {\n      return html`<nve-select part=\"select\" multiple-overflow ?fit-text=${!(el as HTMLSelectElement).multiple}>${slot}</nve-select>`;\n    } else if (el.tagName === 'INPUT' && (el as HTMLInputElement).type === 'date') {\n      return html`<nve-date part=\"date\">${slot}</nve-date>`;\n    } else if (el.tagName === 'INPUT') {\n      return html`<nve-input part=\"input\">${slot}</nve-input>`;\n    } else {\n      return slot;\n    }\n  }\n\n  render() {\n    return html`\n    <div internal-host>\n      ${this.inputs.map(el => this.#getControlTemplate(el))}\n      ${this.closable ? html`<nve-icon-button part=\"icon-button\" exportparts=\"icon:icon-button-icon\" @click=${() => this.#typeClosableController.close()} .ariaLabel=${this.i18n.close} icon-name=\"cancel\"></nve-icon-button>` : nothing}\n    </div>\n    <slot hidden-slot @slotchange=${this.#createItems}></slot>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'toolbar';\n    this.setAttribute('nve-control', '');\n    appendRootNodeStyle(this, globalStyles);\n  }\n\n  #removeItem(e: Event) {\n    if (!(e.target as HTMLSlotElement).assignedElements().length) {\n      this.#resetItems();\n    }\n  }\n\n  #createItems(e: Event) {\n    if (e.target && (e.target as HTMLSlotElement).assignedElements().length) {\n      this.#resetItems();\n      const items = Array.from(\n        this.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!.assignedElements()\n      ).filter(i => i.matches('input, select, nve-button, [nve-control]'));\n      items.forEach(i => (i.slot = generateId()));\n      this.inputs = items.length ? items : this.inputs;\n    }\n  }\n\n  #resetItems() {\n    Array.from(this.shadowRoot!.querySelectorAll('slot'))\n      .flatMap(i => i.assignedElements())\n      .forEach(i => (i.slot = ''));\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA8CO,IAAA,IAAA,cAAoC,EAAW;;yBAgBZ,IAAI,EAAqB,IAAI,eAGlC,KAAKA,GAAgB,oBAEnB,CAAC,aAIZ,IAAI,EAAuB,IAAI;;;kBAxB9B;GACzB,KAAK;GACL,SAAS;EACX;;;4BAE4B;IACzB,EAAM,SAAS,MAAM;IACrB,EAAO,SAAS,MAAM;IACtB,EAAK,SAAS,MAAM;IACpB,EAAW,SAAS,MAAM;EAC7B;;CAKA;;gBAOgB,EAAU,CAAC,CAAM,CAAC;;CAElC;CAKA,GAAoB,GAAa;EAC/B,IAAM,IAAO,CAAI,eAAc,EAAG,KAAK,iBAAe,KAAKC,GAAY;EAQrE,OAPE,EAAG,YAAY,WACV,CAAI,0DAAyD,CAAE,EAAyB,SAAS,IAAG,EAAK,iBACvG,EAAG,YAAY,WAAY,EAAwB,SAAS,SAC9D,CAAI,yBAAyB,EAAK,eAChC,EAAG,YAAY,UACjB,CAAI,2BAA2B,EAAK,gBAEpC;CAEX;CAEA,SAAS;EACP,OAAO,CAAI,sBAEP,KAAK,OAAO,KAAI,MAAM,KAAKC,GAAoB,CAAE,CAAC,EAAE,GACpD,KAAK,WAAW,CAAI,yFAAwF,KAAKC,GAAwB,MAAM,EAAE,gBAAc,KAAK,KAAK,MAAM,2CAA0C,EAAQ,uCAErM,KAAKC,GAAa;CAEpD;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,WACvB,KAAK,aAAa,eAAe,EAAE,GACnC,EAAoB,MAAM,CAAY;CACxC;CAEA,GAAY,GAAU;EACpB,AAAM,EAAE,OAA2B,iBAAiB,CAAC,CAAC,UACpD,KAAKC,GAAY;CAErB;CAEA,GAAa,GAAU;EACrB,IAAI,EAAE,UAAW,EAAE,OAA2B,iBAAiB,CAAC,CAAC,QAAQ;GACvE,KAAKA,GAAY;GACjB,IAAM,IAAQ,MAAM,KAClB,KAAK,WAAY,cAA+B,kBAAkB,CAAC,CAAE,iBAAiB,CACxF,CAAC,CAAC,QAAO,MAAK,EAAE,QAAQ,0CAA0C,CAAC;GAEnE,AADA,EAAM,SAAQ,MAAM,EAAE,OAAO,EAAW,CAAE,GAC1C,KAAK,SAAS,EAAM,SAAS,IAAQ,KAAK;EAC5C;CACF;CAEA,KAAc;EACZ,MAAM,KAAK,KAAK,WAAY,iBAAiB,MAAM,CAAC,CAAC,CAClD,SAAQ,MAAK,EAAE,iBAAiB,CAAC,CAAC,CAClC,SAAQ,MAAM,EAAE,OAAO,EAAG;CAC/B;AACF;GArEG,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,MAK1B,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MAEzB,EAAM,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,UAvBR,EAAQ,GACR,EAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"progressive-filter-chip2.js","names":[],"sources":["../../src/progressive-filter-chip/progressive-filter-chip.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport {\n  appendRootNodeStyle,\n  attachInternals,\n  generateId,\n  I18nController,\n  scopedRegistry,\n  TypeClosableController,\n  typeSSR,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { Input } from '@nvidia-elements/core/input';\nimport { Select } from '@nvidia-elements/core/select';\nimport { Date } from '@nvidia-elements/core/date';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport globalStyles from './progressive-filter-chip.global.css?inline';\nimport styles from './progressive-filter-chip.css?inline';\n\n/**\n * @element nve-progressive-filter-chip\n * @description A filter chip is a control that enables users to select many options from a set of choices.\n * @documentation https://nvidia.github.io/elements/docs/elements/progressive-filter-chip/\n * @since 0.16.0\n * @entrypoint \\@nvidia-elements/core/progressive-filter-chip\n * @slot - `input`, `select`, `nve-button`, or other `[nve-control]` elements used to build the filter.\n * @event close - Dispatched when the filter chip closes.\n * @cssprop --gap\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --background\n * @cssprop --font-weight\n * @cssprop --padding\n * @cssprop --width\n * @csspart select - The select element\n * @csspart date - The date input element\n * @csspart input - The input element\n * @csspart icon-button - The icon button element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/\n */\n@typeSSR()\n@scopedRegistry()\nexport class ProgressiveFilterChip extends LitElement {\n  static readonly metadata = {\n    tag: 'nve-progressive-filter-chip',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Input.metadata.tag]: Input,\n    [Select.metadata.tag]: Select,\n    [Date.metadata.tag]: Date,\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  /** Determines if a close button should render within filter chip */\n  @property({ type: Boolean }) closable: boolean;\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  @state() private inputs: Element[] = [];\n\n  static styles = useStyles([styles]);\n\n  #typeClosableController = new TypeClosableController(this);\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #getControlTemplate(el: Element) {\n    const slot = html`<slot name=${el.slot} @slotchange=${this.#removeItem}></slot>`;\n    if (el.tagName === 'SELECT') {\n      return html`<nve-select part=\"select\" multiple-overflow ?fit-text=${!(el as HTMLSelectElement).multiple}>${slot}</nve-select>`;\n    } else if (el.tagName === 'INPUT' && (el as HTMLInputElement).type === 'date') {\n      return html`<nve-date part=\"date\">${slot}</nve-date>`;\n    } else if (el.tagName === 'INPUT') {\n      return html`<nve-input part=\"input\">${slot}</nve-input>`;\n    } else {\n      return slot;\n    }\n  }\n\n  render() {\n    return html`\n    <div internal-host>\n      ${this.inputs.map(el => this.#getControlTemplate(el))}\n      ${this.closable ? html`<nve-icon-button part=\"icon-button\" exportparts=\"icon:icon-button-icon\" @click=${() => this.#typeClosableController.close()} .ariaLabel=${this.i18n.close} icon-name=\"cancel\"></nve-icon-button>` : nothing}\n    </div>\n    <slot hidden-slot @slotchange=${this.#createItems}></slot>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'toolbar';\n    this.setAttribute('nve-control', '');\n    appendRootNodeStyle(this, globalStyles);\n  }\n\n  #removeItem(e: Event) {\n    if (!(e.target as HTMLSlotElement).assignedElements().length) {\n      this.#resetItems();\n    }\n  }\n\n  #createItems(e: Event) {\n    if (e.target && (e.target as HTMLSlotElement).assignedElements().length) {\n      this.#resetItems();\n      const items = Array.from(\n        this.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!.assignedElements()\n      ).filter(i => i.matches('input, select, nve-button, [nve-control]'));\n      items.forEach(i => (i.slot = generateId()));\n      this.inputs = items.length ? items : this.inputs;\n    }\n  }\n\n  #resetItems() {\n    Array.from(this.shadowRoot!.querySelectorAll('slot'))\n      .flatMap(i => i.assignedElements())\n      .forEach(i => (i.slot = ''));\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA8CO,IAAM,IAAN,cAAoC,EAAW;;EAyB1B,aATc,KAAA,KAAA,IAAI,EAAqB,IAAI,GAGlC,KAAA,OAAA,KAAK,GAAgB,MAEnB,KAAA,SAAA,CAAC,GAIZ,KAAA,KAAA,IAAI,EAAuB,IAAI;;;EAxB9B,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA;IACzB,EAAM,SAAS,MAAM;IACrB,EAAO,SAAS,MAAM;IACtB,EAAK,SAAS,MAAM;IACpB,EAAW,SAAS,MAAM;EAC7B;;CAKA;;EAOgB,KAAA,SAAA,EAAU,CAAC,CAAM,CAAC;;CAElC;CAKA,GAAoB,GAAa;EAC/B,IAAM,IAAO,CAAI,eAAc,EAAG,KAAK,iBAAe,KAAK,GAAY;EAQrE,OAPE,EAAG,YAAY,WACV,CAAI,0DAAyD,CAAE,EAAyB,SAAS,IAAG,EAAK,iBACvG,EAAG,YAAY,WAAY,EAAwB,SAAS,SAC9D,CAAI,yBAAyB,EAAK,eAChC,EAAG,YAAY,UACjB,CAAI,2BAA2B,EAAK,gBAEpC;CAEX;CAEA,SAAS;EACP,OAAO,CAAI,sBAEP,KAAK,OAAO,KAAI,MAAM,KAAK,GAAoB,CAAE,CAAC,EAAE,GACpD,KAAK,WAAW,CAAI,yFAAwF,KAAK,GAAwB,MAAM,EAAE,gBAAc,KAAK,KAAK,MAAM,2CAA0C,EAAQ,uCAErM,KAAK,GAAa;CAEpD;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,WACvB,KAAK,aAAa,eAAe,EAAE,GACnC,EAAoB,MAAM,CAAY;CACxC;CAEA,GAAY,GAAU;EACpB,AAAM,EAAE,OAA2B,iBAAiB,CAAC,CAAC,UACpD,KAAK,GAAY;CAErB;CAEA,GAAa,GAAU;EACrB,IAAI,EAAE,UAAW,EAAE,OAA2B,iBAAiB,CAAC,CAAC,QAAQ;GACvE,KAAK,GAAY;GACjB,IAAM,IAAQ,MAAM,KAClB,KAAK,WAAY,cAA+B,kBAAkB,CAAC,CAAE,iBAAiB,CACxF,CAAC,CAAC,QAAO,MAAK,EAAE,QAAQ,0CAA0C,CAAC;GAEnE,AADA,EAAM,SAAQ,MAAM,EAAE,OAAO,EAAW,CAAE,GAC1C,KAAK,SAAS,EAAM,SAAS,IAAQ,KAAK;EAC5C;CACF;CAEA,KAAc;EACZ,MAAM,KAAK,KAAK,WAAY,iBAAiB,MAAM,CAAC,CAAC,CAClD,SAAQ,MAAK,EAAE,iBAAiB,CAAC,CAAC,CAClC,SAAQ,MAAM,EAAE,OAAO,EAAG;CAC/B;AACF;AArEG,EAAA,CAAA,EAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GAK1B,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAEzB,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAvBR,IAAA,EAAA,CAAA,EAAQ,GACR,EAAe,CAAA,GAAA,CAAA"}

package/dist/pulse/pulse2.js

@@ -1,6 +1,6 @@
 import { attachInternals as e } from "../internal/utils/a11y.js";
 import { useStyles as t } from "../internal/styles/index.js";
-import n from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
+import n from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import { Icon as r } from "../icon/icon2.js";
 import i from "./pulse.js";
 import { LitElement as a, html as o } from "lit";
@@ -13,7 +13,7 @@ var c = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-pulse",
-			version: "2.7.2"
+			version: "2.8.0"
 		};
 	}
 	static {

package/dist/pulse/pulse2.js.map

@@ -1 +1 @@
-{"version":3,"file":"pulse2.js","names":[],"sources":["../../src/pulse/pulse.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { Size } from '@nvidia-elements/core/internal';\nimport { useStyles, attachInternals } from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './pulse.css?inline';\n\n/**\n * @element nve-pulse\n * @description Pulse component signals attention for a particular area of a UI. This helps with tutorial/getting started guides for new users.\n * @documentation https://nvidia.github.io/elements/docs/elements/pulse/\n * @since 1.16.3\n * @entrypoint \\@nvidia-elements/core/pulse\n * @cssprop --background\n * @cssprop --width\n * @cssprop --height\n * @cssprop --animation-duration\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/alert/\n *\n */\nexport class Pulse extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-pulse',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'alert';\n  }\n\n  /** Sets size of the pulse component. You can also update size using the `width + height` css props. */\n  @property({ type: String, reflect: true }) size?: Size | 'xs';\n\n  /** These visual treatments represent the `status` of different tasks. When `status` changes to `accent`, `warning` or `danger`, the component embeds appropriate colors. */\n  @property({ type: String, reflect: true }) status?: 'accent' | 'warning' | 'danger';\n\n  render() {\n    return html`\n    <svg internal-host width=\"100%\" height=\"100%\" viewBox=\"0 0 200 200\">\n      <circle class=\"circle\" cx=\"100\" cy=\"100\" r=\"25\"></circle>\n      <circle class=\"circle c1\" cx=\"100\" cy=\"100\" r=\"25\"></circle>\n      <circle class=\"circle c2\" cx=\"100\" cy=\"100\" r=\"25\"></circle> \n      <circle class=\"circle c3\" cx=\"100\" cy=\"100\" r=\"25\"></circle>\n    </svg>\n  `;\n  }\n}\n"],"mappings":";;;;;;;;AAuBA,IAAa,IAAb,cAA2B,EAAW;;gBACpB,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;EACX;;;4BAE4B,GACzB,EAAK,SAAS,MAAM,EACvB;;CAKA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO;CACzB;CAQA,SAAS;EACP,OAAO,CAAI;CAQb;AACF;GAfG,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MAGxC,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA"}
+{"version":3,"file":"pulse2.js","names":[],"sources":["../../src/pulse/pulse.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { Size } from '@nvidia-elements/core/internal';\nimport { useStyles, attachInternals } from '@nvidia-elements/core/internal';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport styles from './pulse.css?inline';\n\n/**\n * @element nve-pulse\n * @description Pulse component signals attention for a particular area of a UI. This helps with tutorial/getting started guides for new users.\n * @documentation https://nvidia.github.io/elements/docs/elements/pulse/\n * @since 1.16.3\n * @entrypoint \\@nvidia-elements/core/pulse\n * @cssprop --background\n * @cssprop --width\n * @cssprop --height\n * @cssprop --animation-duration\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/alert/\n *\n */\nexport class Pulse extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-pulse',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'alert';\n  }\n\n  /** Sets size of the pulse component. You can also update size using the `width + height` css props. */\n  @property({ type: String, reflect: true }) size?: Size | 'xs';\n\n  /** These visual treatments represent the `status` of different tasks. When `status` changes to `accent`, `warning` or `danger`, the component embeds appropriate colors. */\n  @property({ type: String, reflect: true }) status?: 'accent' | 'warning' | 'danger';\n\n  render() {\n    return html`\n    <svg internal-host width=\"100%\" height=\"100%\" viewBox=\"0 0 200 200\">\n      <circle class=\"circle\" cx=\"100\" cy=\"100\" r=\"25\"></circle>\n      <circle class=\"circle c1\" cx=\"100\" cy=\"100\" r=\"25\"></circle>\n      <circle class=\"circle c2\" cx=\"100\" cy=\"100\" r=\"25\"></circle> \n      <circle class=\"circle c3\" cx=\"100\" cy=\"100\" r=\"25\"></circle>\n    </svg>\n  `;\n  }\n}\n"],"mappings":";;;;;;;;AAuBA,IAAa,IAAb,cAA2B,EAAW;;EACpB,KAAA,SAAA,EAAU,CAAC,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAK,SAAS,MAAM,EACvB;;CAKA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO;CACzB;CAQA,SAAS;EACP,OAAO,CAAI;CAQb;AACF;AAfG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA"}

package/dist/radio/radio-group2.js

@@ -1,7 +1,7 @@
 import { audit as e } from "../internal/controllers/audit.controller.js";
 import { typeSSR as t } from "../internal/controllers/type-ssr.controller.js";
 import { useStyles as n } from "../internal/styles/index.js";
-import r from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
+import r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import { ControlGroup as i } from "../forms/control-group/control-group2.js";
 import a from "./radio-group.js";
 //#region src/radio/radio-group.ts
@@ -12,7 +12,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-radio-group",
-			version: "2.7.2",
+			version: "2.8.0",
 			children: [
 				"label",
 				"nve-control-message",

package/dist/radio/radio-group2.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-group2.js","names":[],"sources":["../../src/radio/radio-group.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { CSSResult } from 'lit';\nimport { audit, typeSSR, useStyles } from '@nvidia-elements/core/internal';\nimport { ControlGroup } from '@nvidia-elements/core/forms';\nimport styles from './radio-group.css?inline';\n\n/**\n * @element nve-radio-group\n * @description Groups related radio buttons together with a shared label and validation messaging for single-select form inputs.\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/radio\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/radio/\n */\n@audit()\n@typeSSR()\nexport class RadioGroup extends ControlGroup {\n  static styles: CSSResult[] = useStyles([...ControlGroup.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-radio-group',\n    version: '0.0.0',\n    children: ['label', 'nve-control-message', 'nve-radio']\n  };\n}\n"],"mappings":";;;;;;;AAiBO,IAAA,IAAA,cAAyB,EAAa;;gBACd,EAAU,CAAC,GAAG,EAAa,QAAQ,CAAM,CAAC;;;kBAE5C;GACzB,KAAK;GACL,SAAS;GACT,UAAU;IAAC;IAAS;IAAuB;GAAW;EACxD;;AACF;OAVC,EAAM,GACN,EAAQ,CAAA,GAAA,CAAA"}
+{"version":3,"file":"radio-group2.js","names":[],"sources":["../../src/radio/radio-group.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { CSSResult } from 'lit';\nimport { audit, typeSSR, useStyles } from '@nvidia-elements/core/internal';\nimport { ControlGroup } from '@nvidia-elements/core/forms';\nimport styles from './radio-group.css?inline';\n\n/**\n * @element nve-radio-group\n * @description Groups related radio buttons together with a shared label and validation messaging for single-select form inputs.\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/radio\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/radio/\n */\n@audit()\n@typeSSR()\nexport class RadioGroup extends ControlGroup {\n  static styles: CSSResult[] = useStyles([...ControlGroup.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-radio-group',\n    version: '0.0.0',\n    children: ['label', 'nve-control-message', 'nve-radio']\n  };\n}\n"],"mappings":";;;;;;;AAiBO,IAAM,IAAN,cAAyB,EAAa;;EACd,KAAA,SAAA,EAAU,CAAC,GAAG,EAAa,QAAQ,CAAM,CAAC;;;EAE5C,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,UAAU;IAAC;IAAS;IAAuB;GAAW;EACxD;;AACF;AAVC,IAAA,EAAA,CAAA,EAAM,GACN,EAAQ,CAAA,GAAA,CAAA"}

package/dist/radio/radio2.js

@@ -1,7 +1,7 @@
 import { audit as e } from "../internal/controllers/audit.controller.js";
 import { hostAttr as t } from "../internal/decorators/host-attr.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 r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import { Control as i } from "../forms/control/control2.js";
 import a from "./radio.js";
 //#region src/radio/radio.ts
@@ -15,7 +15,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-radio",
-			version: "2.7.2",
+			version: "2.8.0",
 			children: [
 				"label",
 				"input",

package/dist/radio/radio2.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio2.js","names":[],"sources":["../../src/radio/radio.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { CSSResult } from 'lit';\nimport { audit, hostAttr, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport styles from './radio.css?inline';\n\n/**\n * @element nve-radio\n * @description A radio button is a control that enables users to choose one option from a list of mutually exclusive options.\n * @documentation https://nvidia.github.io/elements/docs/elements/radio/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/radio\n * @cssprop --cursor\n * @cssprop --width\n * @cssprop --height\n * @cssprop --border-width\n * @cssprop --border-radius\n * @cssprop --border-color\n * @cssprop --radio-color\n * @cssprop --background\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/radio/\n */\n@audit()\nexport class Radio extends Control {\n  @hostAttr({ attribute: 'nve-control' }) protected nveControl = 'inline';\n\n  /** @private - disable for inline control */\n  declare fitText: boolean;\n\n  /** @private - disable for inline control */\n  declare fitContent: boolean;\n\n  static styles: CSSResult[] = useStyles([...Control.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-radio',\n    version: '0.0.0',\n    children: ['label', 'input', 'nve-control-message']\n  };\n}\n"],"mappings":";;;;;;;AAyBO,IAAA,IAAA,cAAoB,EAAQ;;iCAC8B;;;gBAQlC,EAAU,CAAC,GAAG,EAAQ,QAAQ,CAAM,CAAC;;;kBAEvC;GACzB,KAAK;GACL,SAAS;GACT,UAAU;IAAC;IAAS;IAAS;GAAqB;EACpD;;AACF;GAfG,EAAS,EAAE,WAAW,cAAc,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,UAFvC,EAAM,CAAA,GAAA,CAAA"}
+{"version":3,"file":"radio2.js","names":[],"sources":["../../src/radio/radio.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { CSSResult } from 'lit';\nimport { audit, hostAttr, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport styles from './radio.css?inline';\n\n/**\n * @element nve-radio\n * @description A radio button is a control that enables users to choose one option from a list of mutually exclusive options.\n * @documentation https://nvidia.github.io/elements/docs/elements/radio/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/radio\n * @cssprop --cursor\n * @cssprop --width\n * @cssprop --height\n * @cssprop --border-width\n * @cssprop --border-radius\n * @cssprop --border-color\n * @cssprop --radio-color\n * @cssprop --background\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/radio/\n */\n@audit()\nexport class Radio extends Control {\n  @hostAttr({ attribute: 'nve-control' }) protected nveControl = 'inline';\n\n  /** @private - disable for inline control */\n  declare fitText: boolean;\n\n  /** @private - disable for inline control */\n  declare fitContent: boolean;\n\n  static styles: CSSResult[] = useStyles([...Control.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-radio',\n    version: '0.0.0',\n    children: ['label', 'input', 'nve-control-message']\n  };\n}\n"],"mappings":";;;;;;;AAyBO,IAAM,IAAN,cAAoB,EAAQ;;EAC8B,aAAA,KAAA,aAAA;;;EAQlC,KAAA,SAAA,EAAU,CAAC,GAAG,EAAQ,QAAQ,CAAM,CAAC;;;EAEvC,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,UAAU;IAAC;IAAS;IAAS;GAAqB;EACpD;;AACF;AAfG,EAAA,CAAA,EAAS,EAAE,WAAW,cAAc,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,GAFvC,IAAA,EAAA,CAAA,EAAM,CAAA,GAAA,CAAA"}

package/dist/range/range2.js

@@ -1,6 +1,6 @@
 import { appendRootNodeStyle as e, getElementUpdate as t } from "../internal/utils/dom.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 r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import { Control as i } from "../forms/control/control2.js";
 import a from "./range.global.js";
 import o from "./range.js";
@@ -17,7 +17,7 @@ var d = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-range",
-			version: "2.7.2"
+			version: "2.8.0"
 		};
 	}
 	connectedCallback() {
@@ -40,8 +40,8 @@ var d = class extends i {
 	#t(e) {
 		let t = Array.from(e.options), n = this.input?.min ? parseFloat(this.input.min) : 0, r = this.input?.max ? parseFloat(this.input.max) : 100;
 		return s`<div class="datalist-labels">${t.map((e) => {
-			let t = parseFloat(e.value), i = (t - n) / (r - n) * 100;
-			return s`<span class="datalist-tick" style="${this.orientation === "vertical" ? `bottom: ${i}%; transform: translateY(${i}%)` : `left: ${i}%; transform: translateX(-${i}%)`}">${e.textContent || t}</span>`;
+			let t = parseFloat(e.value), i = (t - n) / (r - n) * 100, a = this.orientation === "vertical" ? `bottom: ${i}%; transform: translateY(${i}%)` : `left: ${i}%; transform: translateX(-${i}%)`;
+			return s`<span class="datalist-tick" style="${a}">${e.textContent || t}</span>`;
 		})}</div>`;
 	}
 };

package/dist/range/range2.js.map

@@ -1 +1 @@
-{"version":3,"file":"range2.js","names":["#setTrackWidth","#renderDatalistTicks"],"sources":["../../src/range/range.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { appendRootNodeStyle, getElementUpdate, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { property } from 'lit/decorators/property.js';\nimport globalStyles from './range.global.css?inline';\nimport styles from './range.css?inline';\nimport type { PropertyValues } from 'lit';\nimport { html, nothing, isServer } from 'lit';\n/**\n * @element nve-range\n * @description A range slider is a control that enables users to choose a value from a continuous range of values.\n * @documentation https://nvidia.github.io/elements/docs/elements/range/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/range\n * @cssprop --background\n * @cssprop --control-height\n * @cssprop --cursor\n * @cssprop --track-width\n * @cssprop --track-height\n * @cssprop --track-border-radius\n * @cssprop --track-background\n * @cssprop --thumb-width\n * @cssprop --thumb-height\n * @cssprop --thumb-background\n * @cssprop --thumb-border\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/slider/\n */\nexport class Range extends Control {\n  static styles = useStyles([...Control.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-range',\n    version: '0.0.0'\n  };\n\n  /** Determines the orientation of the range slider. */\n  @property({ type: String, reflect: true }) orientation: 'vertical' | 'horizontal' = 'horizontal';\n\n  connectedCallback() {\n    super.connectedCallback();\n    appendRootNodeStyle(this, globalStyles);\n    this._internals.ariaOrientation = this.orientation;\n  }\n\n  firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n    this.#setTrackWidth();\n    this.input.addEventListener('input', () => this.#setTrackWidth());\n    getElementUpdate(this.input, 'value', (value: unknown) => this.#setTrackWidth(value as number));\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    if (props.has('orientation')) {\n      this._internals.ariaOrientation = this.orientation;\n    }\n  }\n\n  #setTrackWidth(val?: number) {\n    const value = val ?? this.input.valueAsNumber;\n    const min = this.input.min ? parseFloat(this.input.min) : 0;\n    const max = this.input.max ? parseFloat(this.input.max) : 100;\n    this.style.setProperty('--track-width', `${Math.floor(((value - min) / (max - min)) * 100) / 100}`);\n  }\n\n  protected get suffixContent() {\n    const datalist = !isServer ? this.querySelector<HTMLDataListElement>('datalist') : null;\n    return datalist ? this.#renderDatalistTicks(datalist) : nothing;\n  }\n\n  #renderDatalistTicks(datalist: HTMLDataListElement) {\n    const options = Array.from(datalist.options);\n    const min = this.input?.min ? parseFloat(this.input.min) : 0;\n    const max = this.input?.max ? parseFloat(this.input.max) : 100;\n\n    return html`<div class=\"datalist-labels\">\n      ${options.map(option => {\n        const value = parseFloat(option.value);\n        const position = ((value - min) / (max - min)) * 100;\n        const style =\n          this.orientation === 'vertical'\n            ? `bottom: ${position}%; transform: translateY(${position}%)`\n            : `left: ${position}%; transform: translateX(-${position}%)`;\n        return html`<span class=\"datalist-tick\" style=${style}>${option.textContent || value}</span>`;\n      })}\n    </div>`;\n  }\n}\n"],"mappings":";;;;;;;;;AA6BA,IAAa,IAAb,cAA2B,EAAQ;;kCASmD;;;gBARpE,EAAU,CAAC,GAAG,EAAQ,QAAQ,CAAM,CAAC;;;kBAE1B;GACzB,KAAK;GACL,SAAS;EACX;;CAKA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,EAAoB,MAAM,CAAY,GACtC,KAAK,WAAW,kBAAkB,KAAK;CACzC;CAEA,aAAa,GAA6B;EAIxC,AAHA,MAAM,aAAa,CAAK,GACxB,KAAKA,GAAe,GACpB,KAAK,MAAM,iBAAiB,eAAe,KAAKA,GAAe,CAAC,GAChE,EAAiB,KAAK,OAAO,UAAU,MAAmB,KAAKA,GAAe,CAAe,CAAC;CAChG;CAEA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQ,CAAK,GACf,EAAM,IAAI,aAAa,MACzB,KAAK,WAAW,kBAAkB,KAAK;CAE3C;CAEA,GAAe,GAAc;EAC3B,IAAM,IAAQ,KAAO,KAAK,MAAM,eAC1B,IAAM,KAAK,MAAM,MAAM,WAAW,KAAK,MAAM,GAAG,IAAI,GACpD,IAAM,KAAK,MAAM,MAAM,WAAW,KAAK,MAAM,GAAG,IAAI;EAC1D,KAAK,MAAM,YAAY,iBAAiB,GAAG,KAAK,OAAQ,IAAQ,MAAQ,IAAM,KAAQ,GAAG,IAAI,KAAK;CACpG;CAEA,IAAc,gBAAgB;EAC5B,IAAM,IAAY,IAAiE,OAAtD,KAAK,cAAmC,UAAU;EAC/E,OAAO,IAAW,KAAKC,GAAqB,CAAQ,IAAI;CAC1D;CAEA,GAAqB,GAA+B;EAClD,IAAM,IAAU,MAAM,KAAK,EAAS,OAAO,GACrC,IAAM,KAAK,OAAO,MAAM,WAAW,KAAK,MAAM,GAAG,IAAI,GACrD,IAAM,KAAK,OAAO,MAAM,WAAW,KAAK,MAAM,GAAG,IAAI;EAE3D,OAAO,CAAI,gCACP,EAAQ,KAAI,MAAU;GACtB,IAAM,IAAQ,WAAW,EAAO,KAAK,GAC/B,KAAa,IAAQ,MAAQ,IAAM,KAAQ;GAKjD,OAAO,CAAI,sCAHT,KAAK,gBAAgB,aACjB,WAAW,EAAS,2BAA2B,EAAS,MACxD,SAAS,EAAS,4BAA4B,EAAS,IACP,IAAG,EAAO,eAAe,EAAM;EACvF,CAAC,EAAE;CAEP;AACF;GAnDG,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA"}
+{"version":3,"file":"range2.js","names":[],"sources":["../../src/range/range.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { appendRootNodeStyle, getElementUpdate, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { property } from 'lit/decorators/property.js';\nimport globalStyles from './range.global.css?inline';\nimport styles from './range.css?inline';\nimport type { PropertyValues } from 'lit';\nimport { html, nothing, isServer } from 'lit';\n/**\n * @element nve-range\n * @description A range slider is a control that enables users to choose a value from a continuous range of values.\n * @documentation https://nvidia.github.io/elements/docs/elements/range/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/range\n * @cssprop --background\n * @cssprop --control-height\n * @cssprop --cursor\n * @cssprop --track-width\n * @cssprop --track-height\n * @cssprop --track-border-radius\n * @cssprop --track-background\n * @cssprop --thumb-width\n * @cssprop --thumb-height\n * @cssprop --thumb-background\n * @cssprop --thumb-border\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/slider/\n */\nexport class Range extends Control {\n  static styles = useStyles([...Control.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-range',\n    version: '0.0.0'\n  };\n\n  /** Determines the orientation of the range slider. */\n  @property({ type: String, reflect: true }) orientation: 'vertical' | 'horizontal' = 'horizontal';\n\n  connectedCallback() {\n    super.connectedCallback();\n    appendRootNodeStyle(this, globalStyles);\n    this._internals.ariaOrientation = this.orientation;\n  }\n\n  firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n    this.#setTrackWidth();\n    this.input.addEventListener('input', () => this.#setTrackWidth());\n    getElementUpdate(this.input, 'value', (value: unknown) => this.#setTrackWidth(value as number));\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    if (props.has('orientation')) {\n      this._internals.ariaOrientation = this.orientation;\n    }\n  }\n\n  #setTrackWidth(val?: number) {\n    const value = val ?? this.input.valueAsNumber;\n    const min = this.input.min ? parseFloat(this.input.min) : 0;\n    const max = this.input.max ? parseFloat(this.input.max) : 100;\n    this.style.setProperty('--track-width', `${Math.floor(((value - min) / (max - min)) * 100) / 100}`);\n  }\n\n  protected get suffixContent() {\n    const datalist = !isServer ? this.querySelector<HTMLDataListElement>('datalist') : null;\n    return datalist ? this.#renderDatalistTicks(datalist) : nothing;\n  }\n\n  #renderDatalistTicks(datalist: HTMLDataListElement) {\n    const options = Array.from(datalist.options);\n    const min = this.input?.min ? parseFloat(this.input.min) : 0;\n    const max = this.input?.max ? parseFloat(this.input.max) : 100;\n\n    return html`<div class=\"datalist-labels\">\n      ${options.map(option => {\n        const value = parseFloat(option.value);\n        const position = ((value - min) / (max - min)) * 100;\n        const style =\n          this.orientation === 'vertical'\n            ? `bottom: ${position}%; transform: translateY(${position}%)`\n            : `left: ${position}%; transform: translateX(-${position}%)`;\n        return html`<span class=\"datalist-tick\" style=${style}>${option.textContent || value}</span>`;\n      })}\n    </div>`;\n  }\n}\n"],"mappings":";;;;;;;;;AA6BA,IAAa,IAAb,cAA2B,EAAQ;;EASmD,aAAA,KAAA,cAAA;;;EARpE,KAAA,SAAA,EAAU,CAAC,GAAG,EAAQ,QAAQ,CAAM,CAAC;;;EAE1B,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAKA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,EAAoB,MAAM,CAAY,GACtC,KAAK,WAAW,kBAAkB,KAAK;CACzC;CAEA,aAAa,GAA6B;EAIxC,AAHA,MAAM,aAAa,CAAK,GACxB,KAAK,GAAe,GACpB,KAAK,MAAM,iBAAiB,eAAe,KAAK,GAAe,CAAC,GAChE,EAAiB,KAAK,OAAO,UAAU,MAAmB,KAAK,GAAe,CAAe,CAAC;CAChG;CAEA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQ,CAAK,GACf,EAAM,IAAI,aAAa,MACzB,KAAK,WAAW,kBAAkB,KAAK;CAE3C;CAEA,GAAe,GAAc;EAC3B,IAAM,IAAQ,KAAO,KAAK,MAAM,eAC1B,IAAM,KAAK,MAAM,MAAM,WAAW,KAAK,MAAM,GAAG,IAAI,GACpD,IAAM,KAAK,MAAM,MAAM,WAAW,KAAK,MAAM,GAAG,IAAI;EAC1D,KAAK,MAAM,YAAY,iBAAiB,GAAG,KAAK,OAAQ,IAAQ,MAAQ,IAAM,KAAQ,GAAG,IAAI,KAAK;CACpG;CAEA,IAAc,gBAAgB;EAC5B,IAAM,IAAY,IAAiE,OAAtD,KAAK,cAAmC,UAAU;EAC/E,OAAO,IAAW,KAAK,GAAqB,CAAQ,IAAI;CAC1D;CAEA,GAAqB,GAA+B;EAClD,IAAM,IAAU,MAAM,KAAK,EAAS,OAAO,GACrC,IAAM,KAAK,OAAO,MAAM,WAAW,KAAK,MAAM,GAAG,IAAI,GACrD,IAAM,KAAK,OAAO,MAAM,WAAW,KAAK,MAAM,GAAG,IAAI;EAE3D,OAAO,CAAI,gCACP,EAAQ,KAAI,MAAU;GACtB,IAAM,IAAQ,WAAW,EAAO,KAAK,GAC/B,KAAa,IAAQ,MAAQ,IAAM,KAAQ,KAC3C,IACJ,KAAK,gBAAgB,aACjB,WAAW,EAAS,2BAA2B,EAAS,MACxD,SAAS,EAAS,4BAA4B,EAAS;GAC7D,OAAO,CAAI,sCAAqC,EAAM,IAAG,EAAO,eAAe,EAAM;EACvF,CAAC,EAAE;CAEP;AACF;AAnDG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA"}

package/dist/resize-handle/resize-handle2.js

@@ -1,7 +1,7 @@
 import { GestureController as e } from "../internal/controllers/gesture.controller.js";
 import { I18nController as t } from "../internal/controllers/i18n.controller.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 r from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import i from "./resize-handle.js";
 import { LitElement as a, html as o } from "lit";
 import { property as s } from "lit/decorators/property.js";
@@ -18,7 +18,7 @@ var u = class extends c(a) {
 	static {
 		this.metadata = {
 			tag: "nve-resize-handle",
-			version: "2.7.2",
+			version: "2.8.0",
 			valueSchema: { type: "number" }
 		};
 	}

package/dist/resize-handle/resize-handle2.js.map

@@ -1 +1 @@
-{"version":3,"file":"resize-handle2.js","names":["#range","#i18nController","#gestureController","#setInput","#setChange","#dragPointerId","#dragStart","#dragEnd","#cancelDrag","#dragMove","#offset","#handleGesture","#handlePointerInput","#toggle","#updateValue"],"sources":["../../src/resize-handle/resize-handle.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement, type PropertyValues } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { property } from 'lit/decorators/property.js';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixins';\nimport {\n  GestureController,\n  I18nController,\n  useStyles,\n  type Gesture,\n  type UnhandledPointerInput\n} from '@nvidia-elements/core/internal';\nimport styles from './resize-handle.css?inline';\n\n/**\n * @element nve-resize-handle\n * @description A resize-handle slider is a control that enables users to resize views or panels vertically or horizontally.\n * @documentation https://nvidia.github.io/elements/docs/elements/resize-handle/\n * @since 1.27.0\n * @entrypoint \\@nvidia-elements/core/resize-handle\n * @event toggle - Dispatched when the resize handle is double clicked.\n * @cssprop --background\n * @cssprop --line-width\n * @cssprop --target-size\n * @cssprop --cursor\n\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/slider/\n *\n */\nexport class ResizeHandle extends FormControlMixin<typeof LitElement, number>(LitElement) {\n  /**\n   * Determines the orientation direction of the resize handle.\n   */\n  @property({ type: String, reflect: true }) orientation?: 'horizontal' | 'vertical' = 'horizontal';\n\n  /**\n   * Determines the min resize value.\n   */\n  @property({ type: Number, reflect: true }) min = 0;\n\n  /**\n   * Determines the max resize value.\n   */\n  @property({ type: Number, reflect: true }) max = 100;\n\n  /**\n   * Determines the value step change.\n   */\n  @property({ type: Number, reflect: true }) step = 10;\n\n  static styles = useStyles([styles]);\n\n  get #range() {\n    return this.shadowRoot!.querySelector('input')!;\n  }\n\n  static readonly metadata = {\n    tag: 'nve-resize-handle',\n    version: '0.0.0',\n    valueSchema: {\n      type: 'number' as const\n    }\n  };\n\n  readonly #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  readonly #gestureController: GestureController;\n\n  #dragPointerId?: number;\n\n  /**\n   * Updates internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  #offset = 0;\n\n  render() {\n    return html`\n      <div internal-host>\n        <div class=\"line\" part=\"_line\"></div>\n        <input aria-label=${ifDefined(this.ariaLabel ?? this.i18n.resize)} type=\"range\" min=${this.min} max=${this.max} .valueAsNumber=${this.valueAsNumber} @input=${(e: Event) => this.#setInput((e.target as HTMLInputElement).valueAsNumber)} @change=${(e: Event) => this.#setChange((e.target as HTMLInputElement).valueAsNumber)} step=${this.step} />\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.value = this.value ?? 50;\n    this.#offset = this.valueAsNumber;\n    this.#gestureController = new GestureController(this, {\n      getCapabilities: () => ({ drag: true, pan: false, pinch: false, wheel: false })\n    });\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'none';\n    this.addEventListener('nve-gesture', this.#handleGesture as EventListener);\n    this.addEventListener('nve-pointer-input', this.#handlePointerInput as EventListener);\n  }\n\n  disconnectedCallback() {\n    this.removeEventListener('nve-gesture', this.#handleGesture as EventListener);\n    this.removeEventListener('nve-pointer-input', this.#handlePointerInput as EventListener);\n    this.#cancelDrag();\n    super.disconnectedCallback();\n  }\n\n  firstUpdated(props: PropertyValues) {\n    super.firstUpdated(props);\n    this.#gestureController.target = this;\n    this.addEventListener('dblclick', () => {\n      if (!this.dispatchEvent(new CustomEvent('toggle', { cancelable: true, bubbles: true, composed: true }))) {\n        return;\n      }\n      this.#toggle();\n    });\n  }\n\n  #toggle() {\n    const value = this.valueAsNumber <= this.max && this.valueAsNumber !== this.min ? this.min : this.max;\n    this.#setInput(value);\n    this.#setChange(value);\n  }\n\n  #handlePointerInput = (event: CustomEvent<UnhandledPointerInput>): void => {\n    if (\n      event.detail.kind === 'pointerdown' &&\n      event.detail.event.button === 0 &&\n      event.detail.event.isPrimary &&\n      this.#dragPointerId === undefined\n    ) {\n      this.#dragStart(event.detail.event.pointerId);\n    }\n    if (event.detail.event.pointerId !== this.#dragPointerId) return;\n    if (event.detail.kind === 'pointerup') this.#dragEnd();\n    if (event.detail.kind === 'pointercancel') this.#cancelDrag();\n  };\n\n  #handleGesture = (event: CustomEvent<Gesture<undefined>>): void => {\n    if (event.detail.kind === 'drag' && event.detail.event.pointerId === this.#dragPointerId) {\n      this.#dragMove(event.detail);\n    }\n  };\n\n  #dragStart(pointerId: number) {\n    this.#dragPointerId = pointerId;\n    this.#range.step = '1';\n    this._internals.states.add('active');\n    this.#offset = this.valueAsNumber;\n  }\n\n  #dragMove(gesture: Extract<Gesture<undefined>, { kind: 'drag' }>) {\n    const offset =\n      (this.orientation === 'vertical' ? gesture.movementX : -gesture.movementY) * (this.dir === 'rtl' ? -1 : 1);\n    this.#offset = Math.max(this.min, Math.min(this.max, this.#offset + offset));\n    this.#setInput(this.#offset);\n  }\n\n  #dragEnd() {\n    this.#offset = this.valueAsNumber;\n    this.#range.step = `${this.step}`;\n    this.#dragPointerId = undefined;\n    this._internals.states.delete('active');\n    this.#setChange(this.#offset);\n  }\n\n  #cancelDrag() {\n    if (this.#dragPointerId === undefined) return;\n    this.#dragPointerId = undefined;\n    this.#range.step = `${this.step}`;\n    this._internals.states.delete('active');\n  }\n\n  #setInput(value: number) {\n    this.#updateValue(value);\n    this.dispatchInputEvent();\n  }\n\n  #setChange(value: number) {\n    this.#updateValue(value);\n    this.dispatchChangeEvent();\n  }\n\n  #updateValue(value: number) {\n    if (value <= this.max && value >= this.min) {\n      this.valueAsNumber = value;\n    }\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"resize-handle2.js","names":[],"sources":["../../src/resize-handle/resize-handle.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement, type PropertyValues } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { property } from 'lit/decorators/property.js';\nimport { FormControlMixin } from '@nvidia-elements/forms/mixins';\nimport {\n  GestureController,\n  I18nController,\n  useStyles,\n  type Gesture,\n  type UnhandledPointerInput\n} from '@nvidia-elements/core/internal';\nimport styles from './resize-handle.css?inline';\n\n/**\n * @element nve-resize-handle\n * @description A resize-handle slider is a control that enables users to resize views or panels vertically or horizontally.\n * @documentation https://nvidia.github.io/elements/docs/elements/resize-handle/\n * @since 1.27.0\n * @entrypoint \\@nvidia-elements/core/resize-handle\n * @event toggle - Dispatched when the resize handle is double clicked.\n * @cssprop --background\n * @cssprop --line-width\n * @cssprop --target-size\n * @cssprop --cursor\n\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/slider/\n *\n */\nexport class ResizeHandle extends FormControlMixin<typeof LitElement, number>(LitElement) {\n  /**\n   * Determines the orientation direction of the resize handle.\n   */\n  @property({ type: String, reflect: true }) orientation?: 'horizontal' | 'vertical' = 'horizontal';\n\n  /**\n   * Determines the min resize value.\n   */\n  @property({ type: Number, reflect: true }) min = 0;\n\n  /**\n   * Determines the max resize value.\n   */\n  @property({ type: Number, reflect: true }) max = 100;\n\n  /**\n   * Determines the value step change.\n   */\n  @property({ type: Number, reflect: true }) step = 10;\n\n  static styles = useStyles([styles]);\n\n  get #range() {\n    return this.shadowRoot!.querySelector('input')!;\n  }\n\n  static readonly metadata = {\n    tag: 'nve-resize-handle',\n    version: '0.0.0',\n    valueSchema: {\n      type: 'number' as const\n    }\n  };\n\n  readonly #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  readonly #gestureController: GestureController;\n\n  #dragPointerId?: number;\n\n  /**\n   * Updates internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  #offset = 0;\n\n  render() {\n    return html`\n      <div internal-host>\n        <div class=\"line\" part=\"_line\"></div>\n        <input aria-label=${ifDefined(this.ariaLabel ?? this.i18n.resize)} type=\"range\" min=${this.min} max=${this.max} .valueAsNumber=${this.valueAsNumber} @input=${(e: Event) => this.#setInput((e.target as HTMLInputElement).valueAsNumber)} @change=${(e: Event) => this.#setChange((e.target as HTMLInputElement).valueAsNumber)} step=${this.step} />\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.value = this.value ?? 50;\n    this.#offset = this.valueAsNumber;\n    this.#gestureController = new GestureController(this, {\n      getCapabilities: () => ({ drag: true, pan: false, pinch: false, wheel: false })\n    });\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'none';\n    this.addEventListener('nve-gesture', this.#handleGesture as EventListener);\n    this.addEventListener('nve-pointer-input', this.#handlePointerInput as EventListener);\n  }\n\n  disconnectedCallback() {\n    this.removeEventListener('nve-gesture', this.#handleGesture as EventListener);\n    this.removeEventListener('nve-pointer-input', this.#handlePointerInput as EventListener);\n    this.#cancelDrag();\n    super.disconnectedCallback();\n  }\n\n  firstUpdated(props: PropertyValues) {\n    super.firstUpdated(props);\n    this.#gestureController.target = this;\n    this.addEventListener('dblclick', () => {\n      if (!this.dispatchEvent(new CustomEvent('toggle', { cancelable: true, bubbles: true, composed: true }))) {\n        return;\n      }\n      this.#toggle();\n    });\n  }\n\n  #toggle() {\n    const value = this.valueAsNumber <= this.max && this.valueAsNumber !== this.min ? this.min : this.max;\n    this.#setInput(value);\n    this.#setChange(value);\n  }\n\n  #handlePointerInput = (event: CustomEvent<UnhandledPointerInput>): void => {\n    if (\n      event.detail.kind === 'pointerdown' &&\n      event.detail.event.button === 0 &&\n      event.detail.event.isPrimary &&\n      this.#dragPointerId === undefined\n    ) {\n      this.#dragStart(event.detail.event.pointerId);\n    }\n    if (event.detail.event.pointerId !== this.#dragPointerId) return;\n    if (event.detail.kind === 'pointerup') this.#dragEnd();\n    if (event.detail.kind === 'pointercancel') this.#cancelDrag();\n  };\n\n  #handleGesture = (event: CustomEvent<Gesture<undefined>>): void => {\n    if (event.detail.kind === 'drag' && event.detail.event.pointerId === this.#dragPointerId) {\n      this.#dragMove(event.detail);\n    }\n  };\n\n  #dragStart(pointerId: number) {\n    this.#dragPointerId = pointerId;\n    this.#range.step = '1';\n    this._internals.states.add('active');\n    this.#offset = this.valueAsNumber;\n  }\n\n  #dragMove(gesture: Extract<Gesture<undefined>, { kind: 'drag' }>) {\n    const offset =\n      (this.orientation === 'vertical' ? gesture.movementX : -gesture.movementY) * (this.dir === 'rtl' ? -1 : 1);\n    this.#offset = Math.max(this.min, Math.min(this.max, this.#offset + offset));\n    this.#setInput(this.#offset);\n  }\n\n  #dragEnd() {\n    this.#offset = this.valueAsNumber;\n    this.#range.step = `${this.step}`;\n    this.#dragPointerId = undefined;\n    this._internals.states.delete('active');\n    this.#setChange(this.#offset);\n  }\n\n  #cancelDrag() {\n    if (this.#dragPointerId === undefined) return;\n    this.#dragPointerId = undefined;\n    this.#range.step = `${this.step}`;\n    this._internals.states.delete('active');\n  }\n\n  #setInput(value: number) {\n    this.#updateValue(value);\n    this.dispatchInputEvent();\n  }\n\n  #setChange(value: number) {\n    this.#updateValue(value);\n    this.dispatchChangeEvent();\n  }\n\n  #updateValue(value: number) {\n    if (value <= this.max && value >= this.min) {\n      this.valueAsNumber = value;\n    }\n  }\n}\n"],"mappings":"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"}

package/dist/search/search2.js

@@ -1,6 +1,6 @@
 import { scopedRegistry as e } from "../internal/decorators/scoped-registry.js";
 import { useStyles as t } from "../internal/styles/index.js";
-import n from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
+import n from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import { Control as r } from "../forms/control/control2.js";
 import { IconButton as i } from "../icon-button/icon-button2.js";
 import { inputStyles as a } from "../input/input2.js";
@@ -22,7 +22,7 @@ var l = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-search",
-			version: "2.7.2"
+			version: "2.8.0"
 		};
 	}
 	static {

package/dist/search/search2.js.map

@@ -1 +1 @@
-{"version":3,"file":"search2.js","names":[],"sources":["../../src/search/search.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { ContainerElement } from '@nvidia-elements/core/internal';\nimport { scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { inputStyles } from '@nvidia-elements/core/input';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport styles from './search.css?inline';\n\n/**\n * @element nve-search\n * @description A search is a control that enables users to enter text to search.\n * @documentation https://nvidia.github.io/elements/docs/elements/search/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/search\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --cursor\n * @csspart icon-button - The icon button element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/search\n */\n@scopedRegistry()\nexport class Search extends Control implements ContainerElement {\n  /**\n   * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n   * Use when embedding within another container such as a toolbar.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  /**\n   * Sets the rounded visual style of the input.\n   */\n  @property({ type: Boolean, reflect: true }) rounded = false;\n\n  static styles = useStyles([...Control.styles, inputStyles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-search',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  protected get prefixContent() {\n    return html`<nve-icon-button part=\"icon-button\" icon-name=\"search\" container=\"inline\" aria-hidden=\"true\" readonly></nve-icon-button>`;\n  }\n}\n"],"mappings":";;;;;;;;;;AA6BO,IAAA,IAAA,cAAqB,EAAoC;;8BAUR;;;gBAEtC,EAAU;GAAC,GAAG,EAAQ;GAAQ;GAAa;EAAM,CAAC;;;kBAEvC;GACzB,KAAK;GACL,SAAS;EACX;;;4BAE4B,GACzB,EAAW,SAAS,MAAM,EAC7B;;CAEA,IAAc,gBAAgB;EAC5B,OAAO,CAAI;CACb;AACF;GArBG,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,WAAA,KAAA,CAAA,UAX3C,EAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"search2.js","names":[],"sources":["../../src/search/search.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { ContainerElement } from '@nvidia-elements/core/internal';\nimport { scopedRegistry, useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { inputStyles } from '@nvidia-elements/core/input';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport styles from './search.css?inline';\n\n/**\n * @element nve-search\n * @description A search is a control that enables users to enter text to search.\n * @documentation https://nvidia.github.io/elements/docs/elements/search/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/search\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --cursor\n * @csspart icon-button - The icon button element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/search\n */\n@scopedRegistry()\nexport class Search extends Control implements ContainerElement {\n  /**\n   * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n   * Use when embedding within another container such as a toolbar.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  /**\n   * Sets the rounded visual style of the input.\n   */\n  @property({ type: Boolean, reflect: true }) rounded = false;\n\n  static styles = useStyles([...Control.styles, inputStyles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-search',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [IconButton.metadata.tag]: IconButton\n  };\n\n  protected get prefixContent() {\n    return html`<nve-icon-button part=\"icon-button\" icon-name=\"search\" container=\"inline\" aria-hidden=\"true\" readonly></nve-icon-button>`;\n  }\n}\n"],"mappings":";;;;;;;;;;AA6BO,IAAM,IAAN,cAAqB,EAAoC;;EAUR,aAAA,KAAA,UAAA;;;EAEtC,KAAA,SAAA,EAAU;GAAC,GAAG,EAAQ;GAAQ;GAAa;EAAM,CAAC;;;EAEvC,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAW,SAAS,MAAM,EAC7B;;CAEA,IAAc,gBAAgB;EAC5B,OAAO,CAAI;CACb;AACF;AArBG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,GAX3C,IAAA,EAAA,CAAA,EAAe,CAAA,GAAA,CAAA"}

package/dist/select/select2.js

@@ -4,7 +4,7 @@ import { focusElementTimeout as r, onListboxActivate as i } from "../internal/ut
 import { appendRootNodeStyle as a, getElementUpdate as o } from "../internal/utils/dom.js";
 import { scopedRegistry as s } from "../internal/decorators/scoped-registry.js";
 import { useStyles as c } from "../internal/styles/index.js";
-import l from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
+import l from "../_virtual/_@oxc-project_runtime@0.147.0/helpers/esm/decorate.js";
 import { Icon as u } from "../icon/icon2.js";
 import { Control as d } from "../forms/control/control2.js";
 import { Tag as f } from "../tag/tag2.js";
@@ -27,7 +27,7 @@ var S = class extends d {
 	static {
 		this.metadata = {
 			tag: "nve-select",
-			version: "2.7.2"
+			version: "2.8.0"
 		};
 	}
 	static {