@nvidia-elements/core 2.23.4 → 2.23.6

package/dist/select/select2.js.map

@@ -1 +1 @@
-{"version":3,"file":"select2.js","names":["styles","globalStyles","_decorate","__decorate","select_default","select_global_default","i18nDefaults","Select","Control","_args","#i18nController","I18nController","#observers","#optionObservers","useStyles","Icon","Dropdown","Menu","MenuItem","Tag","#select","#options","#dropdown","#menuItems","#input","#tags","#caret","#placeholderOption","o","#multipleSelectLabel","option","label","#selectValue","nothing","#menu","ifDefined","i","#closeDropdown","#openDropdown","props","#setupCustomSelectUI","getElementUpdate","onChildListMutation","#syncOptionSelectedStates","#disconnectObservers","#setupOverflowListener","#syncSelectValueStates","observer","#overflowObserver","#observedTags","options","appendRootNodeStyle","#setupObservers","#observeTags","onListboxActivate","focusElementTimeout","input","inputWidth","inputEntry","entries","entry","#updateMultipleOverflow","tags","selected","width","property","i18n","scopedRegistry"],"sources":["../../src/select/select.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, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport {\n  focusElementTimeout,\n  onListboxActivate,\n  useStyles,\n  onChildListMutation,\n  getElementUpdate,\n  scopedRegistry,\n  appendRootNodeStyle\n} from '@nvidia-elements/core/internal';\nimport { i18n, I18nController, type I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Dropdown } from '@nvidia-elements/core/dropdown';\nimport { Tag } from '@nvidia-elements/core/tag';\nimport styles from './select.css?inline';\nimport globalStyles from './select.global.css?inline';\n\nconst i18nDefaults = {\n  select: 'select',\n  selected: 'selected'\n} satisfies I18nDefaults;\n\n/**\n * @element nve-select\n * @description A select is a control that enables users to select an option from a list of options.\n * @documentation https://nvidia.github.io/elements/docs/elements/select/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/select\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --border-bottom\n * @cssprop --cursor\n * @cssprop --font-weight\n * @cssprop --text-align\n * @cssprop --scroll-height\n * @cssprop --width\n * @cssprop --control-width\n * @cssprop --max-width\n * @cssprop --min-width\n * @cssprop --box-shadow\n * @cssprop --max-height\n * @cssprop --text-transform\n * @csspart tag\n * @csspart menu - The dropdown menu element\n * @csspart menu-item - The menu item elements\n * @csspart icon - The icon element\n * @csspart caret - The caret/chevron icon element\n * @csspart dropdown - The dropdown popup element\n * @slot - Select input element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select\n */\n@i18n<Select>()\n@scopedRegistry()\nexport class Select extends Control {\n  static styles = useStyles([...Control.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-select',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon,\n    [Dropdown.metadata.tag]: Dropdown,\n    [Menu.metadata.tag]: Menu,\n    [MenuItem.metadata.tag]: MenuItem,\n    [Tag.metadata.tag]: Tag\n  };\n\n  /** Flat container option applies when embedding the component within another containing element */\n  @property({ type: String, reflect: true }) container?: 'flat' | 'inline';\n\n  #i18nController: I18nController<this> = new I18nController<this>(this, i18nDefaults);\n\n  /** Updates internal string values for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  get #select() {\n    return this.input as unknown as HTMLSelectElement;\n  }\n\n  get #options() {\n    return Array.from(this.#select?.options ? this.#select.options : []);\n  }\n\n  get #dropdown() {\n    return this.shadowRoot!.querySelector<Dropdown>(Dropdown.metadata.tag);\n  }\n\n  get #menuItems() {\n    return this.shadowRoot!.querySelectorAll<MenuItem>(MenuItem.metadata.tag);\n  }\n\n  get #input() {\n    return this.shadowRoot!.querySelector<HTMLElement>('[input]');\n  }\n\n  get #tags() {\n    return this.shadowRoot!.querySelector('.tags');\n  }\n\n  get #caret() {\n    return this.shadowRoot!.querySelector<Icon>('[name=\"caret\"]');\n  }\n\n  get #placeholderOption() {\n    return this.#options.find(o => o.selected && o.hidden && o.disabled);\n  }\n\n  #observers: (MutationObserver | ResizeObserver)[] = [];\n  #overflowObserver?: ResizeObserver;\n  #observedTags?: Element | null;\n\n  get #multipleSelectLabel() {\n    const option = this.#placeholderOption;\n    const label = option ? option.innerText : `${this.#select.selectedOptions.length} ${this.i18n.selected}`;\n    return html`<div class=\"tags-label ${option ? 'placeholder' : ''}\" aria-hidden=\"true\">${label}</div>`;\n  }\n\n  protected get prefixContent() {\n    return this.#select?.multiple && this.#select?.size === 0\n      ? html`\n    ${this.#multipleSelectLabel}\n    <div class=\"tags\">\n      ${this.#options\n        .filter(o => o.selected && o !== this.#placeholderOption)\n        .map(\n          o => html`\n      <nve-tag part=\"tag\" readonly color=\"gray-slate\" closable .value=${o.value} @click=${() => this.#selectValue(o, false)}>${o.textContent}</nve-tag>`\n        )}\n    </div>`\n      : nothing;\n  }\n\n  get #menu() {\n    return html`\n    <nve-menu part=\"menu\" role=\"listbox\" style=\"--width: 100%; --min-width: fit-content\" aria-label=${ifDefined(this.i18n.select)}>\n      ${this.#options\n        .filter(o => o !== this.#placeholderOption)\n        .map(\n          (o, i) => html`\n      <nve-menu-item part=\"menu-item\" role=\"option\" @click=${() => this.#selectValue(o, !o.selected)} ?selected=${o.selected} ?disabled=${o.disabled} ?hidden=${!!o.hidden} aria-selected=${o.selected}>\n        <slot name=\"option-${i + 1}\">\n          <nve-icon part=\"icon\" name=\"check\" size=\"sm\" aria-hidden=\"true\"></nve-icon> ${o.innerText}\n        </slot>\n      </nve-menu-item>`\n        )}\n    </nve-menu>`;\n  }\n\n  protected get suffixContent() {\n    return this.#select?.size === 0\n      ? html`\n      <nve-icon name=\"caret\" part=\"caret\" direction=\"down\" size=\"sm\" aria-hidden=\"true\"></nve-icon>\n      <nve-dropdown part=\"dropdown\" @close=${this.#closeDropdown} @open=${this.#openDropdown} hidden .anchor=${this.#input} position=\"bottom\">\n        ${this.#menu}\n      </nve-dropdown>`\n      : this.#menu;\n  }\n\n  async firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n    await this.updateComplete;\n    this.#setupCustomSelectUI();\n  }\n\n  #syncSelectValueStates() {\n    this.#observers.push(\n      getElementUpdate(this.#select, 'value', () => this.requestUpdate()),\n      onChildListMutation(this.#select, () => this.requestUpdate(), { attributes: true, subtree: true }),\n      onChildListMutation(this.#select, () => this.#syncOptionSelectedStates(), { subtree: true })\n    );\n  }\n\n  #optionObservers = new Map<HTMLOptionElement, MutationObserver>();\n\n  #setupObservers() {\n    this.#disconnectObservers();\n    this.#setupOverflowListener();\n    this.#syncSelectValueStates();\n    this.#syncOptionSelectedStates();\n  }\n\n  #disconnectObservers() {\n    this.#observers.forEach(observer => observer.disconnect());\n    this.#observers = [];\n    this.#optionObservers.clear();\n    this.#overflowObserver = undefined;\n    this.#observedTags = undefined;\n  }\n\n  #syncOptionSelectedStates() {\n    const options = new Set(this.#options);\n\n    this.#optionObservers.forEach((observer, option) => {\n      if (!options.has(option)) {\n        observer.disconnect();\n        this.#optionObservers.delete(option);\n        this.#observers = this.#observers.filter(o => o !== observer);\n      }\n    });\n\n    this.#options.forEach(o => {\n      if (!this.#optionObservers.has(o)) {\n        const observer = getElementUpdate(o, 'selected', () => this.requestUpdate());\n        this.#optionObservers.set(o, observer);\n        this.#observers.push(observer);\n      }\n    });\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    appendRootNodeStyle(this, globalStyles);\n    void this.updateComplete.then(() => {\n      if (this.isConnected) {\n        this.#setupObservers();\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#disconnectObservers();\n  }\n\n  async updated(props: PropertyValues<this>) {\n    super.updated(props);\n    if (this.#select?.size && this.#select?.size !== 0) {\n      this._internals.states.add('size');\n      this.style.setProperty('--size', `${this.#select.size}`);\n    } else {\n      this._internals.states.delete('size');\n      this.style.removeProperty('--size');\n    }\n\n    if (this.#select?.multiple && this.#select?.size === 0) {\n      this._internals.states.add('multiple');\n    } else {\n      this._internals.states.delete('multiple');\n    }\n    this.#observeTags();\n  }\n\n  #setupCustomSelectUI() {\n    if (this.#select?.size === 0) {\n      onListboxActivate(this.#select, () => {\n        this.requestUpdate(); // update menu items\n        this.#dropdown!.style.setProperty('--min-width', `${this.#input!.getBoundingClientRect().width}px`);\n        this.#dropdown!.showPopover();\n        focusElementTimeout(this.#menuItems[0] as HTMLElement);\n      });\n    }\n  }\n\n  #openDropdown() {\n    this.#dropdown!.hidden = false;\n    this.#caret!.direction = 'up';\n  }\n\n  #closeDropdown() {\n    this.#dropdown!.hidden = true;\n    this.#caret!.direction = 'down';\n  }\n\n  #setupOverflowListener() {\n    const input = this.#input;\n    if (!input) return;\n    let inputWidth: number | undefined;\n    const observer = new ResizeObserver(entries => {\n      const inputEntry = entries.find(entry => entry.target === input);\n      if (inputEntry) inputWidth = inputEntry.contentRect.width;\n      if (this.isConnected && inputWidth !== undefined) this.#updateMultipleOverflow(inputWidth);\n    });\n    this.#overflowObserver = observer;\n    this.#observers.push(observer);\n    observer.observe(input);\n    this.#observeTags();\n  }\n\n  #observeTags() {\n    const observer = this.#overflowObserver;\n    if (!observer) return;\n    const tags = this.#tags;\n    if (tags === this.#observedTags) return;\n    if (this.#observedTags) observer.unobserve(this.#observedTags);\n    this.#observedTags = tags;\n    if (tags) observer.observe(tags);\n    else this._internals.states.delete('multiple-overflow');\n  }\n\n  async #selectValue(option: HTMLOptionElement, selected: boolean) {\n    if (this.#select.multiple || (!this.#select.multiple && option.value !== this.#select.value)) {\n      option.selected = selected;\n    }\n\n    // native select only the first selected option determines the select input value\n    if (this.#select.selectedOptions.length < 1) {\n      this.#select.value = selected ? option.value : '';\n    }\n\n    this.#select.dispatchEvent(new Event('input', { bubbles: true }));\n    this.#select.dispatchEvent(new Event('change', { bubbles: true }));\n    this.requestUpdate();\n\n    if (!this.#select.multiple && this.#dropdown) {\n      this.#dropdown.hidePopover();\n    } else {\n      await this.updateComplete;\n      this.#updateMultipleOverflow(this.#input!.getBoundingClientRect().width);\n    }\n  }\n\n  #updateMultipleOverflow(width: number) {\n    const tags = this.#tags;\n    if (this.#select?.multiple && tags && tags.getBoundingClientRect().width > width - 48) {\n      this._internals.states.add('multiple-overflow');\n    } else {\n      this._internals.states.delete('multiple-overflow');\n    }\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"select2.js","names":["styles","globalStyles","_decorate","__decorate","select_default","select_global_default","i18nDefaults","Select","Control","_args","#i18nController","I18nController","#observers","#optionObservers","useStyles","Icon","Dropdown","Menu","MenuItem","Tag","#select","#options","#dropdown","#menuItems","#input","#tags","#caret","#placeholderOption","o","#multipleSelectLabel","option","label","#selectValue","nothing","#menu","ifDefined","i","#closeDropdown","#openDropdown","props","#setupCustomSelectUI","getElementUpdate","onChildListMutation","#syncOptionSelectedStates","#disconnectObservers","#setupOverflowListener","#syncSelectValueStates","observer","#overflowObserver","#observedTags","options","appendRootNodeStyle","#setupObservers","#observeTags","onListboxActivate","focusElementTimeout","input","inputWidth","inputEntry","entries","entry","#updateMultipleOverflow","tags","selected","width","property","i18n","scopedRegistry"],"sources":["../../src/select/select.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, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport {\n  focusElementTimeout,\n  onListboxActivate,\n  onChildListMutation,\n  getElementUpdate,\n  appendRootNodeStyle\n} from '@nvidia-elements/core/internal';\nimport { scopedRegistry } from '@nvidia-elements/foundations/internal/decorators';\nimport { useStyles } from '@nvidia-elements/foundations/internal/styles';\nimport { i18n, I18nController, type I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport { Control } from '@nvidia-elements/core/forms';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Menu, MenuItem } from '@nvidia-elements/core/menu';\nimport { Dropdown } from '@nvidia-elements/core/dropdown';\nimport { Tag } from '@nvidia-elements/core/tag';\nimport styles from './select.css?inline';\nimport globalStyles from './select.global.css?inline';\n\nconst i18nDefaults = {\n  select: 'select',\n  selected: 'selected'\n} satisfies I18nDefaults;\n\n/**\n * @element nve-select\n * @description A select is a control that enables users to select an option from a list of options.\n * @documentation https://nvidia.github.io/elements/docs/elements/select/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/select\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --border-bottom\n * @cssprop --cursor\n * @cssprop --font-weight\n * @cssprop --text-align\n * @cssprop --scroll-height\n * @cssprop --width\n * @cssprop --control-width\n * @cssprop --max-width\n * @cssprop --min-width\n * @cssprop --box-shadow\n * @cssprop --max-height\n * @cssprop --text-transform\n * @csspart tag\n * @csspart menu - The dropdown menu element\n * @csspart menu-item - The menu item elements\n * @csspart icon - The icon element\n * @csspart caret - The caret/chevron icon element\n * @csspart dropdown - The dropdown popup element\n * @slot - Select input element\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select\n */\n@i18n<Select>()\n@scopedRegistry()\nexport class Select extends Control {\n  static styles = useStyles([...Control.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-select',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon,\n    [Dropdown.metadata.tag]: Dropdown,\n    [Menu.metadata.tag]: Menu,\n    [MenuItem.metadata.tag]: MenuItem,\n    [Tag.metadata.tag]: Tag\n  };\n\n  /** Flat container option applies when embedding the component within another containing element */\n  @property({ type: String, reflect: true }) container?: 'flat' | 'inline';\n\n  #i18nController: I18nController<this> = new I18nController<this>(this, i18nDefaults);\n\n  /** Updates internal string values for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  get #select() {\n    return this.input as unknown as HTMLSelectElement;\n  }\n\n  get #options() {\n    return Array.from(this.#select?.options ? this.#select.options : []);\n  }\n\n  get #dropdown() {\n    return this.shadowRoot!.querySelector<Dropdown>(Dropdown.metadata.tag);\n  }\n\n  get #menuItems() {\n    return this.shadowRoot!.querySelectorAll<MenuItem>(MenuItem.metadata.tag);\n  }\n\n  get #input() {\n    return this.shadowRoot!.querySelector<HTMLElement>('[input]');\n  }\n\n  get #tags() {\n    return this.shadowRoot!.querySelector('.tags');\n  }\n\n  get #caret() {\n    return this.shadowRoot!.querySelector<Icon>('[name=\"caret\"]');\n  }\n\n  get #placeholderOption() {\n    return this.#options.find(o => o.selected && o.hidden && o.disabled);\n  }\n\n  #observers: (MutationObserver | ResizeObserver)[] = [];\n  #overflowObserver?: ResizeObserver;\n  #observedTags?: Element | null;\n\n  get #multipleSelectLabel() {\n    const option = this.#placeholderOption;\n    const label = option ? option.innerText : `${this.#select.selectedOptions.length} ${this.i18n.selected}`;\n    return html`<div class=\"tags-label ${option ? 'placeholder' : ''}\" aria-hidden=\"true\">${label}</div>`;\n  }\n\n  protected get prefixContent() {\n    return this.#select?.multiple && this.#select?.size === 0\n      ? html`\n    ${this.#multipleSelectLabel}\n    <div class=\"tags\">\n      ${this.#options\n        .filter(o => o.selected && o !== this.#placeholderOption)\n        .map(\n          o => html`\n      <nve-tag part=\"tag\" readonly color=\"gray-slate\" closable .value=${o.value} @click=${() => this.#selectValue(o, false)}>${o.textContent}</nve-tag>`\n        )}\n    </div>`\n      : nothing;\n  }\n\n  get #menu() {\n    return html`\n    <nve-menu part=\"menu\" role=\"listbox\" style=\"--width: 100%; --min-width: fit-content\" aria-label=${ifDefined(this.i18n.select)}>\n      ${this.#options\n        .filter(o => o !== this.#placeholderOption)\n        .map(\n          (o, i) => html`\n      <nve-menu-item part=\"menu-item\" role=\"option\" @click=${() => this.#selectValue(o, !o.selected)} ?selected=${o.selected} ?disabled=${o.disabled} ?hidden=${!!o.hidden} aria-selected=${o.selected}>\n        <slot name=\"option-${i + 1}\">\n          <nve-icon part=\"icon\" name=\"check\" size=\"sm\" aria-hidden=\"true\"></nve-icon> ${o.innerText}\n        </slot>\n      </nve-menu-item>`\n        )}\n    </nve-menu>`;\n  }\n\n  protected get suffixContent() {\n    return this.#select?.size === 0\n      ? html`\n      <nve-icon name=\"caret\" part=\"caret\" direction=\"down\" size=\"sm\" aria-hidden=\"true\"></nve-icon>\n      <nve-dropdown part=\"dropdown\" @close=${this.#closeDropdown} @open=${this.#openDropdown} hidden .anchor=${this.#input} position=\"bottom\">\n        ${this.#menu}\n      </nve-dropdown>`\n      : this.#menu;\n  }\n\n  async firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n    await this.updateComplete;\n    this.#setupCustomSelectUI();\n  }\n\n  #syncSelectValueStates() {\n    this.#observers.push(\n      getElementUpdate(this.#select, 'value', () => this.requestUpdate()),\n      onChildListMutation(this.#select, () => this.requestUpdate(), { attributes: true, subtree: true }),\n      onChildListMutation(this.#select, () => this.#syncOptionSelectedStates(), { subtree: true })\n    );\n  }\n\n  #optionObservers = new Map<HTMLOptionElement, MutationObserver>();\n\n  #setupObservers() {\n    this.#disconnectObservers();\n    this.#setupOverflowListener();\n    this.#syncSelectValueStates();\n    this.#syncOptionSelectedStates();\n  }\n\n  #disconnectObservers() {\n    this.#observers.forEach(observer => observer.disconnect());\n    this.#observers = [];\n    this.#optionObservers.clear();\n    this.#overflowObserver = undefined;\n    this.#observedTags = undefined;\n  }\n\n  #syncOptionSelectedStates() {\n    const options = new Set(this.#options);\n\n    this.#optionObservers.forEach((observer, option) => {\n      if (!options.has(option)) {\n        observer.disconnect();\n        this.#optionObservers.delete(option);\n        this.#observers = this.#observers.filter(o => o !== observer);\n      }\n    });\n\n    this.#options.forEach(o => {\n      if (!this.#optionObservers.has(o)) {\n        const observer = getElementUpdate(o, 'selected', () => this.requestUpdate());\n        this.#optionObservers.set(o, observer);\n        this.#observers.push(observer);\n      }\n    });\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    appendRootNodeStyle(this, globalStyles);\n    void this.updateComplete.then(() => {\n      if (this.isConnected) {\n        this.#setupObservers();\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#disconnectObservers();\n  }\n\n  async updated(props: PropertyValues<this>) {\n    super.updated(props);\n    if (this.#select?.size && this.#select?.size !== 0) {\n      this._internals.states.add('size');\n      this.style.setProperty('--size', `${this.#select.size}`);\n    } else {\n      this._internals.states.delete('size');\n      this.style.removeProperty('--size');\n    }\n\n    if (this.#select?.multiple && this.#select?.size === 0) {\n      this._internals.states.add('multiple');\n    } else {\n      this._internals.states.delete('multiple');\n    }\n    this.#observeTags();\n  }\n\n  #setupCustomSelectUI() {\n    if (this.#select?.size === 0) {\n      onListboxActivate(this.#select, () => {\n        this.requestUpdate(); // update menu items\n        this.#dropdown!.style.setProperty('--min-width', `${this.#input!.getBoundingClientRect().width}px`);\n        this.#dropdown!.showPopover();\n        focusElementTimeout(this.#menuItems[0] as HTMLElement);\n      });\n    }\n  }\n\n  #openDropdown() {\n    this.#dropdown!.hidden = false;\n    this.#caret!.direction = 'up';\n  }\n\n  #closeDropdown() {\n    this.#dropdown!.hidden = true;\n    this.#caret!.direction = 'down';\n  }\n\n  #setupOverflowListener() {\n    const input = this.#input;\n    if (!input) return;\n    let inputWidth: number | undefined;\n    const observer = new ResizeObserver(entries => {\n      const inputEntry = entries.find(entry => entry.target === input);\n      if (inputEntry) inputWidth = inputEntry.contentRect.width;\n      if (this.isConnected && inputWidth !== undefined) this.#updateMultipleOverflow(inputWidth);\n    });\n    this.#overflowObserver = observer;\n    this.#observers.push(observer);\n    observer.observe(input);\n    this.#observeTags();\n  }\n\n  #observeTags() {\n    const observer = this.#overflowObserver;\n    if (!observer) return;\n    const tags = this.#tags;\n    if (tags === this.#observedTags) return;\n    if (this.#observedTags) observer.unobserve(this.#observedTags);\n    this.#observedTags = tags;\n    if (tags) observer.observe(tags);\n    else this._internals.states.delete('multiple-overflow');\n  }\n\n  async #selectValue(option: HTMLOptionElement, selected: boolean) {\n    if (this.#select.multiple || (!this.#select.multiple && option.value !== this.#select.value)) {\n      option.selected = selected;\n    }\n\n    // native select only the first selected option determines the select input value\n    if (this.#select.selectedOptions.length < 1) {\n      this.#select.value = selected ? option.value : '';\n    }\n\n    this.#select.dispatchEvent(new Event('input', { bubbles: true }));\n    this.#select.dispatchEvent(new Event('change', { bubbles: true }));\n    this.requestUpdate();\n\n    if (!this.#select.multiple && this.#dropdown) {\n      this.#dropdown.hidePopover();\n    } else {\n      await this.updateComplete;\n      this.#updateMultipleOverflow(this.#input!.getBoundingClientRect().width);\n    }\n  }\n\n  #updateMultipleOverflow(width: number) {\n    const tags = this.#tags;\n    if (this.#select?.multiple && tags && tags.getBoundingClientRect().width > width - 48) {\n      this._internals.states.add('multiple-overflow');\n    } else {\n      this._internals.states.delete('multiple-overflow');\n    }\n  }\n}\n"],"mappings":"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"}

package/dist/skeleton/skeleton2.js

@@ -1,28 +1,28 @@
-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.155.0/helpers/esm/decorate.js";
-import r from "./skeleton.js";
-import { LitElement as i, html as a } from "lit";
-import { property as o } from "lit/decorators/property.js";
+import e from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import t from "./skeleton.js";
+import { attachInternals as n } from "@nvidia-elements/foundations/internal/a11y";
+import { LitElement as r, html as i } from "lit";
+import { property as a } from "lit/decorators/property.js";
+import { useStyles as o } from "@nvidia-elements/foundations/internal/styles";
 // src/skeleton/skeleton.ts
-var s = class extends i {
+var s = class extends r {
 	constructor(...e) {
 		super(...e), this.hidden = !1;
 	}
 	static {
-		this.styles = t([r]);
+		this.styles = o([t]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-skeleton",
-			version: "2.23.4"
+			version: "2.23.6"
 		};
 	}
 	render() {
-		return a`<div internal-host><div class="animate"></div><slot @slotchange="${this.#e}"></slot></div>`;
+		return i`<div internal-host><div class="animate"></div><slot @slotchange="${this.#e}"></slot></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), e(this), this._internals.ariaBusy = "true";
+		super.connectedCallback(), n(this), this._internals.ariaBusy = "true";
 	}
 	updated(e) {
 		super.updated(e), this._internals.ariaBusy = `${!this.hidden}`;
@@ -31,13 +31,13 @@ var s = class extends i {
 		e.target.assignedNodes().some((e) => e.nodeType === Node.ELEMENT_NODE || e.nodeType === Node.TEXT_NODE && e.textContent?.trim() !== "") ? this._internals.states.add("slotted") : this._internals.states.delete("slotted");
 	}
 };
-n([o({
+e([a({
 	type: String,
 	reflect: !0
-})], s.prototype, "effect", void 0), n([o({
+})], s.prototype, "effect", void 0), e([a({
 	type: String,
 	reflect: !0
-})], s.prototype, "shape", void 0), n([o({
+})], s.prototype, "shape", void 0), e([a({
 	type: Boolean,
 	reflect: !0
 })], s.prototype, "hidden", void 0);

package/dist/skeleton/skeleton2.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton2.js","names":["styles","_decorate","__decorate","skeleton_default","Skeleton","LitElement","_args","useStyles","#slotchange","attachInternals","props","event","node","property"],"sources":["../../src/skeleton/skeleton.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 { property } from 'lit/decorators/property.js';\nimport { attachInternals, useStyles } from '@nvidia-elements/core/internal';\nimport styles from './skeleton.css?inline';\n\n/**\n * @element nve-skeleton\n * @description A loading placeholder component that displays animated placeholder shapes while content loads.\n * @documentation https://nvidia.github.io/elements/docs/elements/skeleton/\n * @since 1.44.0\n * @entrypoint \\@nvidia-elements/core/skeleton\n * @slot - Loaded content that replaces the placeholder when provided.\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --min-height\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-live\n */\nexport class Skeleton extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-skeleton',\n    version: '0.0.0'\n  };\n\n  /** Visual animation style shown while content loads. */\n  @property({ type: String, reflect: true }) effect: 'shimmer' | 'pulse';\n\n  /** Geometry of the placeholder — rounded corners or a full pill outline. */\n  @property({ type: String, reflect: true }) shape: 'round' | 'pill';\n\n  /** Hides the skeleton host when `true` and sets `aria-busy` to the inverse visibility state. */\n  @property({ type: Boolean, reflect: true }) hidden = false;\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n      <div internal-host>\n        <div class=\"animate\"></div>\n        <slot @slotchange=${this.#slotchange}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.ariaBusy = 'true';\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this._internals.ariaBusy = `${!this.hidden}`;\n  }\n\n  #slotchange(event: Event) {\n    const target = event.target as HTMLSlotElement;\n    const hasContent = target\n      .assignedNodes()\n      .some(\n        node =>\n          node.nodeType === Node.ELEMENT_NODE || (node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== '')\n      );\n\n    if (hasContent) {\n      this._internals.states.add('slotted');\n    } else {\n      this._internals.states.delete('slotted');\n    }\n  }\n}\n"],"mappings":";;;;;;;AAoBA,IAAaI,IAAb,cAA8BC,EAAW;;EAec,A,aAAA,KAAA,SAAA;;;EAdrC,KAAA,SAAAE,EAAU,CAACP,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAcA,SAAS;EACP,OAAO,CAAI,oEAGa,KAAKQ,GAAY;CAG3C;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxBC,EAAgB,IAAI,GACpB,KAAK,WAAW,WAAW;CAC7B;CAEA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQC,CAAK,GACnB,KAAK,WAAW,WAAW,GAAG,CAAC,KAAK;CACtC;CAEA,GAAY,GAAc;EASxB,AAReC,EAAM,OAElB,cAAc,CAAC,CACf,MACC,MACEC,EAAK,aAAa,KAAK,gBAAiBA,EAAK,aAAa,KAAK,aAAaA,EAAK,aAAa,KAAK,MAAM,EAG3G,IACF,KAAK,WAAW,OAAO,IAAI,SAAS,IAEpC,KAAK,WAAW,OAAO,OAAO,SAAS;CAE3C;AACF;AA9CGX,EAAA,CAAAY,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAT,EAAA,WAAA,UAAA,KAAA,CAAA,GAGxCH,EAAA,CAAAY,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAT,EAAA,WAAA,SAAA,KAAA,CAAA,GAGxCH,EAAA,CAAAY,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAAT,EAAA,WAAA,UAAA,KAAA,CAAA"}
+{"version":3,"file":"skeleton2.js","names":["styles","_decorate","__decorate","skeleton_default","Skeleton","LitElement","_args","useStyles","#slotchange","attachInternals","props","event","node","property"],"sources":["../../src/skeleton/skeleton.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 { property } from 'lit/decorators/property.js';\nimport { attachInternals } from '@nvidia-elements/foundations/internal/a11y';\nimport { useStyles } from '@nvidia-elements/foundations/internal/styles';\nimport styles from './skeleton.css?inline';\n\n/**\n * @element nve-skeleton\n * @description A loading placeholder component that displays animated placeholder shapes while content loads.\n * @documentation https://nvidia.github.io/elements/docs/elements/skeleton/\n * @since 1.44.0\n * @entrypoint \\@nvidia-elements/core/skeleton\n * @slot - Loaded content that replaces the placeholder when provided.\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --min-height\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-live\n */\nexport class Skeleton extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-skeleton',\n    version: '0.0.0'\n  };\n\n  /** Visual animation style shown while content loads. */\n  @property({ type: String, reflect: true }) effect: 'shimmer' | 'pulse';\n\n  /** Geometry of the placeholder — rounded corners or a full pill outline. */\n  @property({ type: String, reflect: true }) shape: 'round' | 'pill';\n\n  /** Hides the skeleton host when `true` and sets `aria-busy` to the inverse visibility state. */\n  @property({ type: Boolean, reflect: true }) hidden = false;\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n      <div internal-host>\n        <div class=\"animate\"></div>\n        <slot @slotchange=${this.#slotchange}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.ariaBusy = 'true';\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this._internals.ariaBusy = `${!this.hidden}`;\n  }\n\n  #slotchange(event: Event) {\n    const target = event.target as HTMLSlotElement;\n    const hasContent = target\n      .assignedNodes()\n      .some(\n        node =>\n          node.nodeType === Node.ELEMENT_NODE || (node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== '')\n      );\n\n    if (hasContent) {\n      this._internals.states.add('slotted');\n    } else {\n      this._internals.states.delete('slotted');\n    }\n  }\n}\n"],"mappings":";;;;;;;AAqBA,IAAaI,IAAb,cAA8BC,EAAW;;EAec,A,aAAA,KAAA,SAAA;;;EAdrC,KAAA,SAAAE,EAAU,CAACP,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAcA,SAAS;EACP,OAAO,CAAI,oEAGa,KAAKQ,GAAY;CAG3C;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxBC,EAAgB,IAAI,GACpB,KAAK,WAAW,WAAW;CAC7B;CAEA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQC,CAAK,GACnB,KAAK,WAAW,WAAW,GAAG,CAAC,KAAK;CACtC;CAEA,GAAY,GAAc;EASxB,AAReC,EAAM,OAElB,cAAc,CAAC,CACf,MACC,MACEC,EAAK,aAAa,KAAK,gBAAiBA,EAAK,aAAa,KAAK,aAAaA,EAAK,aAAa,KAAK,MAAM,EAG3G,IACF,KAAK,WAAW,OAAO,IAAI,SAAS,IAEpC,KAAK,WAAW,OAAO,OAAO,SAAS;CAE3C;AACF;AA9CGX,EAAA,CAAAY,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAT,EAAA,WAAA,UAAA,KAAA,CAAA,GAGxCH,EAAA,CAAAY,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAT,EAAA,WAAA,SAAA,KAAA,CAAA,GAGxCH,EAAA,CAAAY,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAAT,EAAA,WAAA,UAAA,KAAA,CAAA"}

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

@@ -32,7 +32,7 @@ export declare class SortButton extends SortButton_base {
     /**
      * Updates internal string values for internationalization.
      */
-    i18n: Partial<import("@nvidia-elements/core/internal").I18nStrings & {
+    i18n: Partial<import("@nvidia-elements/foundations/internal/i18n").I18nStrings & {
         __set: boolean;
     }>;
     render(): import("lit-html").TemplateResult<1>;

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

@@ -1,36 +1,36 @@
-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.155.0/helpers/esm/decorate.js";
-import { Icon as r } from "../icon/icon2.js";
-import i from "./sort-button.js";
-import { LitElement as a, html as o } from "lit";
-import { property as s } from "lit/decorators/property.js";
-import { I18nController as c } from "@nvidia-elements/foundations/internal/i18n";
+import e from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import { Icon as t } from "../icon/icon2.js";
+import n from "./sort-button.js";
+import { LitElement as r, html as i } from "lit";
+import { property as a } from "lit/decorators/property.js";
+import { I18nController as o } from "@nvidia-elements/foundations/internal/i18n";
+import { scopedRegistry as s } from "@nvidia-elements/foundations/internal/decorators";
+import { useStyles as c } from "@nvidia-elements/foundations/internal/styles";
 import { ButtonFormControlMixin as l } from "@nvidia-elements/forms/mixins";
 // src/sort-button/sort-button.ts
 var u = { sort: "sort" }, d = {
 	none: "ascending",
 	ascending: "descending",
 	descending: "none"
-}, f = class extends l(a) {
+}, f = class extends l(r) {
 	static {
-		this.styles = t([i]);
+		this.styles = c([n]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-sort-button",
-			version: "2.23.4"
+			version: "2.23.6"
 		};
 	}
 	static {
-		this.elementDefinitions = { [r.metadata.tag]: r };
+		this.elementDefinitions = { [t.metadata.tag]: t };
 	}
 	#e;
 	render() {
-		return o`<div internal-host focus-within><nve-icon part="icon" .name="${this.sort === "descending" ? "sort-descending" : "sort-ascending"}" aria-hidden="true"></nve-icon></div>`;
+		return i`<div internal-host focus-within><nve-icon part="icon" .name="${this.sort === "descending" ? "sort-descending" : "sort-ascending"}" aria-hidden="true"></nve-icon></div>`;
 	}
 	constructor() {
-		super(), this.sort = "none", this.#e = new c(this, u), this.i18n = this.#e.i18n, this.#t = () => {
+		super(), this.sort = "none", this.#e = new o(this, u), this.i18n = this.#e.i18n, this.#t = () => {
 			this._internals.ariaLabel = `${this.#e.i18n.sort} ${d[this.sort]}`, this.dispatchEvent(new CustomEvent("sort", {
 				detail: {
 					value: this.sort,
@@ -49,10 +49,10 @@ var u = { sort: "sort" }, d = {
 	}
 	#t;
 };
-n([s({
+e([a({
 	type: String,
 	reflect: !0
-})], f.prototype, "sort", void 0), n([s({ type: Object })], f.prototype, "i18n", void 0), f = n([e()], f);
+})], f.prototype, "sort", void 0), e([a({ type: Object })], f.prototype, "i18n", void 0), f = e([s()], f);
 export { f as SortButton };
 
 //# sourceMappingURL=sort-button2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sort-button2.js","names":["styles","_decorate","__decorate","sort_button_default","i18nDefaults","nextSort","SortButton","ButtonFormControlMixin","LitElement","useStyles","Icon","#i18nController","I18nController","#onClick","property","scopedRegistry"],"sources":["../../src/sort-button/sort-button.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ButtonFormControlMixin } from '@nvidia-elements/forms/mixins';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { useStyles, scopedRegistry } from '@nvidia-elements/core/internal';\nimport { I18nController, type I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport styles from './sort-button.css?inline';\n\nconst i18nDefaults = {\n  sort: 'sort'\n} satisfies I18nDefaults;\n\nconst nextSort = {\n  none: 'ascending',\n  ascending: 'descending',\n  descending: 'none'\n};\n\n/**\n * @element nve-sort-button\n * @description A sort button is a control that enables users to sort a list of items in ascending or descending order.\n * @documentation https://nvidia.github.io/elements/docs/elements/sort-button/\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/sort-button\n * @event sort - Dispatched on activation with `detail: { value, next }`, where `value` is the current sort and `next` follows the cycle `none` → `ascending` → `descending` → `none`.\n * @cssprop --width\n * @cssprop --height\n * @cssprop --border-radius\n * @cssprop --color\n * @csspart icon - The icon element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/spinbutton/\n */\n@scopedRegistry()\nexport class SortButton extends ButtonFormControlMixin(LitElement) {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-sort-button',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /**\n   * The current sort value, can be ascending, descending, or none.\n   */\n  @property({ type: String, reflect: true }) sort: 'ascending' | 'descending' | 'none' = 'none';\n\n  #i18nController: I18nController<this> = new I18nController<this>(this, i18nDefaults);\n\n  /**\n   * Updates internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  render() {\n    return html`\n      <div internal-host focus-within>\n        <nve-icon part=\"icon\" .name=${this.sort === 'descending' ? 'sort-descending' : 'sort-ascending'} aria-hidden=\"true\"></nve-icon>\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.type = 'button';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'spinbutton';\n    this.addEventListener('click', this.#onClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#onClick);\n  }\n\n  #onClick = () => {\n    this._internals.ariaLabel = `${this.#i18nController.i18n.sort} ${nextSort[this.sort]}`;\n    this.dispatchEvent(\n      new CustomEvent('sort', {\n        detail: { value: this.sort, next: nextSort[this.sort] },\n        bubbles: true,\n        composed: true\n      })\n    );\n  };\n}\n"],"mappings":";;;;;;;;;;AAWA,IAAMI,IAAe,EACnB,MAAM,OACR,GAEMC,IAAW;CACf,MAAM;CACN,WAAW;CACX,YAAY;AACd,GAiBaC,IAAN,cAAyBC,EAAuBC,CAAU,CAAC,CAAC;;EACjD,KAAA,SAAAC,EAAU,CAACT,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzBU,EAAK,SAAS,MAAMA,EACvB;;CAOA;CAOA,SAAS;EACP,OAAO,CAAI,gEAEuB,KAAK,SAAS,eAAe,oBAAoB,iBAAiB;CAGtG;CAEA,cAAc;EAEZ,AADA,MAAM,GAlB+E,KAAA,OAAA,QAE/C,KAAAC,KAAA,IAAIC,EAAqB,MAAMR,CAAY,GAKhD,KAAA,OAAA,KAAKO,GAAgB,MA0BvC,KAAAE,WAAA;GAEf,AADA,KAAK,WAAW,YAAY,GAAG,KAAKF,GAAgB,KAAK,KAAK,GAAGN,EAAS,KAAK,SAC/E,KAAK,cACH,IAAI,YAAY,QAAQ;IACtB,QAAQ;KAAE,OAAO,KAAK;KAAM,MAAMA,EAAS,KAAK;IAAM;IACtD,SAAS;IACT,UAAU;GACZ,CAAC,CACH;EACF,GAvBE,KAAK,OAAO;CACd;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,KAAK,WAAW,OAAO,cACvB,KAAK,iBAAiB,SAAS,KAAKQ,EAAQ;CAC9C;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAKA,EAAQ;CACjD;CAEA;AAUF;AA3CGZ,EAAA,CAAAa,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAR,EAAA,WAAA,QAAA,KAAA,CAAA,GAOxCL,EAAA,CAAAa,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAAR,EAAA,WAAA,QAAA,KAAA,CAAA,GAvB3B,IAAAL,EAAA,CAAAc,EAAe,CAAA,GAAAT,CAAA"}
+{"version":3,"file":"sort-button2.js","names":["styles","_decorate","__decorate","sort_button_default","i18nDefaults","nextSort","SortButton","ButtonFormControlMixin","LitElement","useStyles","Icon","#i18nController","I18nController","#onClick","property","scopedRegistry"],"sources":["../../src/sort-button/sort-button.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ButtonFormControlMixin } from '@nvidia-elements/forms/mixins';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { scopedRegistry } from '@nvidia-elements/foundations/internal/decorators';\nimport { useStyles } from '@nvidia-elements/foundations/internal/styles';\nimport { I18nController, type I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport styles from './sort-button.css?inline';\n\nconst i18nDefaults = {\n  sort: 'sort'\n} satisfies I18nDefaults;\n\nconst nextSort = {\n  none: 'ascending',\n  ascending: 'descending',\n  descending: 'none'\n};\n\n/**\n * @element nve-sort-button\n * @description A sort button is a control that enables users to sort a list of items in ascending or descending order.\n * @documentation https://nvidia.github.io/elements/docs/elements/sort-button/\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/sort-button\n * @event sort - Dispatched on activation with `detail: { value, next }`, where `value` is the current sort and `next` follows the cycle `none` → `ascending` → `descending` → `none`.\n * @cssprop --width\n * @cssprop --height\n * @cssprop --border-radius\n * @cssprop --color\n * @csspart icon - The icon element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/spinbutton/\n */\n@scopedRegistry()\nexport class SortButton extends ButtonFormControlMixin(LitElement) {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-sort-button',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /**\n   * The current sort value, can be ascending, descending, or none.\n   */\n  @property({ type: String, reflect: true }) sort: 'ascending' | 'descending' | 'none' = 'none';\n\n  #i18nController: I18nController<this> = new I18nController<this>(this, i18nDefaults);\n\n  /**\n   * Updates internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  render() {\n    return html`\n      <div internal-host focus-within>\n        <nve-icon part=\"icon\" .name=${this.sort === 'descending' ? 'sort-descending' : 'sort-ascending'} aria-hidden=\"true\"></nve-icon>\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.type = 'button';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'spinbutton';\n    this.addEventListener('click', this.#onClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#onClick);\n  }\n\n  #onClick = () => {\n    this._internals.ariaLabel = `${this.#i18nController.i18n.sort} ${nextSort[this.sort]}`;\n    this.dispatchEvent(\n      new CustomEvent('sort', {\n        detail: { value: this.sort, next: nextSort[this.sort] },\n        bubbles: true,\n        composed: true\n      })\n    );\n  };\n}\n"],"mappings":";;;;;;;;;;AAYA,IAAMI,IAAe,EACnB,MAAM,OACR,GAEMC,IAAW;CACf,MAAM;CACN,WAAW;CACX,YAAY;AACd,GAiBaC,IAAN,cAAyBC,EAAuBC,CAAU,CAAC,CAAC;;EACjD,KAAA,SAAAC,EAAU,CAACT,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzBU,EAAK,SAAS,MAAMA,EACvB;;CAOA;CAOA,SAAS;EACP,OAAO,CAAI,gEAEuB,KAAK,SAAS,eAAe,oBAAoB,iBAAiB;CAGtG;CAEA,cAAc;EAEZ,AADA,MAAM,GAlB+E,KAAA,OAAA,QAE/C,KAAAC,KAAA,IAAIC,EAAqB,MAAMR,CAAY,GAKhD,KAAA,OAAA,KAAKO,GAAgB,MA0BvC,KAAAE,WAAA;GAEf,AADA,KAAK,WAAW,YAAY,GAAG,KAAKF,GAAgB,KAAK,KAAK,GAAGN,EAAS,KAAK,SAC/E,KAAK,cACH,IAAI,YAAY,QAAQ;IACtB,QAAQ;KAAE,OAAO,KAAK;KAAM,MAAMA,EAAS,KAAK;IAAM;IACtD,SAAS;IACT,UAAU;GACZ,CAAC,CACH;EACF,GAvBE,KAAK,OAAO;CACd;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,KAAK,WAAW,OAAO,cACvB,KAAK,iBAAiB,SAAS,KAAKQ,EAAQ;CAC9C;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAKA,EAAQ;CACjD;CAEA;AAUF;AA3CGZ,EAAA,CAAAa,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAR,EAAA,WAAA,QAAA,KAAA,CAAA,GAOxCL,EAAA,CAAAa,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAAR,EAAA,WAAA,QAAA,KAAA,CAAA,GAvB3B,IAAAL,EAAA,CAAAc,EAAe,CAAA,GAAAT,CAAA"}

package/dist/sparkline/sparkline2.js

@@ -1,127 +1,128 @@
-import { attachInternals as e } from "../internal/utils/a11y.js";
-import { statusStateStyles as t, supportStateStyles as n, useStyles as r } from "../internal/styles/index.js";
-import i from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
-import { calculateDomain as a, calculateSymbolIndices as o, calculateViewBox as s, toAreaPath as c, toColumnRects as l, toInterpolation as u, toLinePath as d, toPlotPoints as f, toValidData as p, toWinLossRects as m, valueToY as h } from "./sparkline.utils.js";
-import g from "./sparkline.js";
-import { LitElement as _, html as v, nothing as y, svg as b } from "lit";
-import { property as x } from "lit/decorators/property.js";
+import { statusStateStyles as e, supportStateStyles as t } from "../internal/styles/index.js";
+import n from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import { calculateDomain as r, calculateSymbolIndices as i, calculateViewBox as a, toAreaPath as o, toColumnRects as s, toInterpolation as c, toLinePath as l, toPlotPoints as u, toValidData as d, toWinLossRects as f, valueToY as p } from "./sparkline.utils.js";
+import m from "./sparkline.js";
+import { attachInternals as h } from "@nvidia-elements/foundations/internal/a11y";
+import { LitElement as g, html as _, nothing as v, svg as y } from "lit";
+import { property as b } from "lit/decorators/property.js";
+import { useStyles as x } from "@nvidia-elements/foundations/internal/styles";
 import { state as S } from "lit/decorators/state.js";
 // src/sparkline/sparkline.ts
-var C = class extends _ {
+var C = class extends g {
 	constructor(...e) {
 		super(...e), this.data = [], this.mark = "line", this.interpolation = "linear", this.denoteFirst = !1, this.denoteLast = !1, this.denoteMin = !1, this.denoteMax = !1, this.intervalLength = .6, this.validData = [];
 	}
 	static {
-		this.styles = r([
-			g,
-			t,
-			n
+		this.styles = x([
+			m,
+			e,
+			t
 		]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-sparkline",
-			version: "2.23.4"
+			version: "2.23.6"
 		};
 	}
 	render() {
-		return v`<div internal-host>${this.#e()}</div>`;
+		return _`<div internal-host>${this.#e()}</div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), e(this), this._internals.role = "img";
+		super.connectedCallback(), h(this), this._internals.role = "img";
 	}
 	willUpdate(e) {
-		super.willUpdate(e), e.has("data") && (this.validData = p(this.data));
+		super.willUpdate(e), e.has("data") && (this.validData = d(this.data));
 	}
 	#e() {
-		let { width: e, height: t } = s(this.mark, this.validData.length, this.intervalLength);
+		let { width: e, height: t } = a(this.mark, this.validData.length, this.intervalLength);
 		switch (this.mark) {
 			case "line":
 			case "area":
 			case "gradient": return this.#t(e, t);
 			case "column": return this.#a(e, t);
 			case "winloss": return this.#o(50, e, t);
-			default: return this.mark, y;
+			default: return this.mark, v;
 		}
 	}
 	updated(e) {
 		super.updated(e);
-		let { width: t, height: n } = s(this.mark, this.validData.length, this.intervalLength), r = t / n, i = Number.isFinite(r) && r > 0 ? r : 1;
+		let { width: t, height: n } = a(this.mark, this.validData.length, this.intervalLength), r = t / n, i = Number.isFinite(r) && r > 0 ? r : 1;
 		this.style.setProperty("--_aspect-ratio", i.toFixed(4));
 	}
 	#t(e, t) {
-		let n = a(this.validData, {
+		let n = r(this.validData, {
 			explicitMin: this.min,
 			explicitMax: this.max
 		});
-		if (!n) return y;
-		let r = h(0, n), i = n.min < 0 && n.max > 0, s = f(this.validData, n, { width: e }), l = o(this.validData, {
+		if (!n) return v;
+		let a = p(0, n), s = n.min < 0 && n.max > 0, d = u(this.validData, n, { width: e }), f = i(this.validData, {
 			first: this.denoteFirst,
 			last: this.denoteLast,
 			min: this.denoteMin,
 			max: this.denoteMax
-		}), p = u(this.interpolation), m = d(s, p, e), g = this.mark === "area" || this.mark === "gradient" ? c(s, p, 100) : "";
-		return b`<svg viewBox="0 0 ${e} ${t}" preserveAspectRatio="xMidYMid meet" aria-hidden="true">${this.mark === "gradient" ? this.#n(t) : y} ${g.length ? this.mark === "gradient" ? b`<path class="area" d="${g}" style="fill:url(#gradient)"></path>` : b`<path class="area" d="${g}"></path>` : y} ${i ? this.#r(r, e) : y} ${m ? b`<path class="line" d="${m}" vector-effect="non-scaling-stroke"></path>` : y}</svg> ${this.#i(s, l)}`;
+		}), m = c(this.interpolation), h = l(d, m, e), g = this.mark === "area" || this.mark === "gradient" ? o(d, m, 100) : "";
+		return y`<svg viewBox="0 0 ${e} ${t}" preserveAspectRatio="xMidYMid meet" aria-hidden="true">${this.mark === "gradient" ? this.#n(t) : v} ${g.length ? this.mark === "gradient" ? y`<path class="area" d="${g}" style="fill:url(#gradient)"></path>` : y`<path class="area" d="${g}"></path>` : v} ${s ? this.#r(a, e) : v} ${h ? y`<path class="line" d="${h}" vector-effect="non-scaling-stroke"></path>` : v}</svg> ${this.#i(d, f)}`;
 	}
 	#n(e) {
-		return b`<defs><linearGradient id="gradient" x1="0" y1="0" x2="0" y2="${e}" gradientUnits="userSpaceOnUse"><stop offset="0%" style="stop-color:var(--gradient-max-color)"></stop><stop offset="100%" style="stop-color:var(--gradient-min-color)"></stop></linearGradient></defs>`;
+		return y`<defs><linearGradient id="gradient" x1="0" y1="0" x2="0" y2="${e}" gradientUnits="userSpaceOnUse"><stop offset="0%" style="stop-color:var(--gradient-max-color)"></stop><stop offset="100%" style="stop-color:var(--gradient-min-color)"></stop></linearGradient></defs>`;
 	}
 	#r(e, t) {
-		return b`<line class="zero-line" vector-effect="non-scaling-stroke" x1="0" y1="${e.toFixed(2)}" x2="${t}" y2="${e.toFixed(2)}"></line>`;
+		return y`<line class="zero-line" vector-effect="non-scaling-stroke" x1="0" y1="${e.toFixed(2)}" x2="${t}" y2="${e.toFixed(2)}"></line>`;
 	}
 	#i(e, t) {
-		return e.length === 0 || t.size === 0 ? y : v`${Array.from(t).map((t) => {
+		return e.length === 0 || t.size === 0 ? v : _`${Array.from(t).map((t) => {
 			let n = e[t];
-			if (!n) return y;
+			if (!n) return v;
 			let r = `--x: ${n.x.toFixed(2)}; --y: ${n.y.toFixed(2)}`;
-			return v`<span style="${r}" class="accent"></span>`;
+			return _`<span style="${r}" class="accent"></span>`;
 		})}`;
 	}
 	#a(e, t) {
-		let n = a(this.validData, {
+		let n = r(this.validData, {
 			explicitMin: this.min,
 			explicitMax: this.max,
 			includeZero: !0
 		});
-		if (!n) return y;
-		let r = h(0, n), i = n.min < 0 && n.max > 0, o = f(this.validData, n, { width: e }), s = l(o, r, e);
-		return b`<svg viewBox="0 0 ${e} ${t}" preserveAspectRatio="xMidYMid meet" aria-hidden="true">${i ? this.#r(r, e) : y} ${s.map((e) => b`<rect class="column" x="${e.x.toFixed(2)}" y="${e.y.toFixed(2)}" width="${e.width.toFixed(2)}" height="${e.height.toFixed(2)}"></rect>`)}</svg>`;
+		if (!n) return v;
+		let i = p(0, n), a = n.min < 0 && n.max > 0, o = u(this.validData, n, { width: e }), c = s(o, i, e);
+		return y`<svg viewBox="0 0 ${e} ${t}" preserveAspectRatio="xMidYMid meet" aria-hidden="true">${a ? this.#r(i, e) : v} ${c.map((e) => y`<rect class="column" x="${e.x.toFixed(2)}" y="${e.y.toFixed(2)}" width="${e.width.toFixed(2)}" height="${e.height.toFixed(2)}"></rect>`)}</svg>`;
 	}
 	#o(e, t, n) {
-		if (this.validData.length === 0) return y;
-		let r = m(this.validData, e, {
+		if (this.validData.length === 0) return v;
+		let r = f(this.validData, e, {
 			width: t,
 			height: n
 		});
-		return b`<svg viewBox="0 0 ${t} ${n}" preserveAspectRatio="xMidYMid meet" aria-hidden="true">${this.#r(e, t)} ${r.map((e) => b`<rect class="${e.className}" x="${e.x.toFixed(2)}" y="${e.y.toFixed(2)}" width="${e.width.toFixed(2)}" height="${e.height.toFixed(2)}"></rect>`)}</svg>`;
+		return y`<svg viewBox="0 0 ${t} ${n}" preserveAspectRatio="xMidYMid meet" aria-hidden="true">${this.#r(e, t)} ${r.map((e) => y`<rect class="${e.className}" x="${e.x.toFixed(2)}" y="${e.y.toFixed(2)}" width="${e.width.toFixed(2)}" height="${e.height.toFixed(2)}"></rect>`)}</svg>`;
 	}
 };
-i([x({ type: Array })], C.prototype, "data", void 0), i([x({ type: String })], C.prototype, "mark", void 0), i([x({ type: String })], C.prototype, "interpolation", void 0), i([x({
+n([b({ type: Array })], C.prototype, "data", void 0), n([b({ type: String })], C.prototype, "mark", void 0), n([b({ type: String })], C.prototype, "interpolation", void 0), n([b({
 	type: String,
 	reflect: !0
-})], C.prototype, "status", void 0), i([x({
+})], C.prototype, "status", void 0), n([b({
 	type: String,
 	reflect: !0
-})], C.prototype, "size", void 0), i([x({
+})], C.prototype, "size", void 0), n([b({
 	type: Boolean,
 	attribute: "denote-first",
 	reflect: !0
-})], C.prototype, "denoteFirst", void 0), i([x({
+})], C.prototype, "denoteFirst", void 0), n([b({
 	type: Boolean,
 	attribute: "denote-last",
 	reflect: !0
-})], C.prototype, "denoteLast", void 0), i([x({
+})], C.prototype, "denoteLast", void 0), n([b({
 	type: Boolean,
 	attribute: "denote-min",
 	reflect: !0
-})], C.prototype, "denoteMin", void 0), i([x({
+})], C.prototype, "denoteMin", void 0), n([b({
 	type: Boolean,
 	attribute: "denote-max",
 	reflect: !0
-})], C.prototype, "denoteMax", void 0), i([x({
+})], C.prototype, "denoteMax", void 0), n([b({
 	type: Number,
 	attribute: "interval-length"
-})], C.prototype, "intervalLength", void 0), i([x({ type: Number })], C.prototype, "min", void 0), i([x({ type: Number })], C.prototype, "max", void 0), i([S()], C.prototype, "validData", void 0);
+})], C.prototype, "intervalLength", void 0), n([b({ type: Number })], C.prototype, "min", void 0), n([b({ type: Number })], C.prototype, "max", void 0), n([S()], C.prototype, "validData", void 0);
 export { C as Sparkline };
 
 //# sourceMappingURL=sparkline2.js.map

package/dist/sparkline/sparkline2.js.map

@@ -1 +1 @@
-{"version":3,"file":"sparkline2.js","names":["styles","_decorate","__decorate","sparkline_default","Sparkline","LitElement","_args","useStyles","statusStateStyles","supportStateStyles","#renderChart","attachInternals","changedProperties","toValidData","calculateViewBox","#renderLineVariant","width","height","#renderColumn","#renderWinLoss","nothing","props","aspectRatio","validAspectRatio","domain","calculateDomain","baselineY","valueToY","drawZeroLine","plotPoints","toPlotPoints","symbolIndices","calculateSymbolIndices","interpolation","toInterpolation","linePath","toLinePath","areaPath","toAreaPath","#renderGradientDef","#renderZeroLine","#renderAccents","position","points","accentIndices","point","index","style","showZeroLine","rects","toColumnRects","rect","toWinLossRects","property","state"],"sources":["../../src/sparkline/sparkline.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues, SVGTemplateResult } from 'lit';\nimport { html, LitElement, nothing, svg } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport type {\n  DataElement,\n  Interpolation,\n  Point,\n  SizeExpanded,\n  SparklineMark,\n  SupportStatus,\n  TaskStatus\n} from '@nvidia-elements/core/internal';\nimport { attachInternals, statusStateStyles, supportStateStyles, useStyles } from '@nvidia-elements/core/internal';\nimport {\n  calculateDomain,\n  calculateSymbolIndices,\n  calculateViewBox,\n  PRECISION,\n  toAreaPath,\n  toColumnRects,\n  toInterpolation,\n  toLinePath,\n  toPlotPoints,\n  toValidData,\n  toWinLossRects,\n  valueToY,\n  VIEW_HEIGHT\n} from './sparkline.utils.js';\nimport styles from './sparkline.css?inline';\n\n/**\n * @element nve-sparkline\n * @description A sparkline is a compact, word-sized chart with typographic scale, for data-dense layouts (text, tables, cards, dashboards).\n * @documentation https://nvidia.github.io/elements/docs/elements/sparkline/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/sparkline\n * @cssprop --height - Height (defaults to 1em and scales with parent font-size).\n * @cssprop --line-color\n * @cssprop --line-width\n * @cssprop --fill-color - Color used by area and column marks.\n * @cssprop --gradient-max-color\n * @cssprop --gradient-min-color\n * @cssprop --zero-line-color\n * @cssprop --zero-line-width\n * @cssprop --win-color  Color used to represent positive values (wins).\n * @cssprop --loss-color Color used to represent negative values (losses).\n * @cssprop --draw-color Color used to represent zero values (draws / neutral outcomes).\n * @cssprop --symbol-color\n * @cssprop --symbol-border-color\n * @cssprop --symbol-border-width\n * @cssprop --symbol-radius - symbol circle radius in SVG units.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img\n */\nexport class Sparkline extends LitElement implements DataElement<number[]> {\n  static styles = useStyles([styles, statusStateStyles, supportStateStyles]);\n\n  static readonly metadata = {\n    tag: 'nve-sparkline',\n    version: '0.0.0'\n  };\n\n  /** Numeric values representing a data series. */\n  @property({ type: Array }) data: number[] = [];\n\n  /** Controls the visual representation of data points. */\n  @property({ type: String }) mark: SparklineMark = 'line';\n\n  /** Controls how the chart connects intermediate values between points in a data series. Defaults to `linear`. */\n  @property({ type: String }) interpolation: Interpolation = 'linear';\n\n  /** Applies semantic status colors used across Elements status patterns. */\n  @property({ type: String, reflect: true }) status?: TaskStatus | SupportStatus;\n\n  /** Controls the sparkline size with explicit font-size tokens. Omit to auto-scale with parent font-size (1em). */\n  @property({ type: String, reflect: true }) size?: SizeExpanded;\n\n  /** Denotes the first data point by rendering a symbol at its position. */\n  @property({ type: Boolean, attribute: 'denote-first', reflect: true })\n  denoteFirst = false;\n\n  /** Denotes the last data point by rendering a symbol at its position. */\n  @property({ type: Boolean, attribute: 'denote-last', reflect: true })\n  denoteLast = false;\n\n  /** Denotes all minimum-value data points by rendering symbols at their positions. */\n  @property({ type: Boolean, attribute: 'denote-min', reflect: true })\n  denoteMin = false;\n\n  /** Denotes all maximum-value data points by rendering symbols at their positions. */\n  @property({ type: Boolean, attribute: 'denote-max', reflect: true })\n  denoteMax = false;\n\n  /** Controls spacing between points in a line, in em (1 = chart height). Defaults to `0.6`. */\n  @property({ type: Number, attribute: 'interval-length' }) intervalLength = 0.6;\n\n  /** Lower bound for the y-axis domain. When undefined, derives the bound from data. */\n  @property({ type: Number }) min?: number;\n\n  /** Upper bound for the y-axis domain. When undefined, derives the bound from data. */\n  @property({ type: Number }) max?: number;\n\n  /** Cached valid numeric values derived from data property. */\n  @state() private validData: number[] = [];\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`<div internal-host>${this.#renderChart()}</div>`;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'img';\n  }\n\n  willUpdate(changedProperties: PropertyValues<this>) {\n    super.willUpdate(changedProperties);\n\n    if (changedProperties.has('data')) {\n      this.validData = toValidData(this.data);\n    }\n  }\n\n  #renderChart(): SVGTemplateResult | typeof nothing {\n    const { width, height } = calculateViewBox(this.mark, this.validData.length, this.intervalLength);\n\n    switch (this.mark) {\n      case 'line':\n      case 'area':\n      case 'gradient':\n        return this.#renderLineVariant(width, height);\n      case 'column':\n        return this.#renderColumn(width, height);\n      case 'winloss':\n        return this.#renderWinLoss(VIEW_HEIGHT / 2, width, height);\n      default:\n        const _exhaustiveCheck: never = this.mark;\n        return nothing;\n    }\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n\n    const { width, height } = calculateViewBox(this.mark, this.validData.length, this.intervalLength);\n    const aspectRatio = width / height;\n    const validAspectRatio = Number.isFinite(aspectRatio) && aspectRatio > 0 ? aspectRatio : 1;\n    this.style.setProperty('--_aspect-ratio', validAspectRatio.toFixed(4));\n  }\n\n  #renderLineVariant(width: number, height: number) {\n    const domain = calculateDomain(this.validData, { explicitMin: this.min, explicitMax: this.max });\n    if (!domain) return nothing;\n\n    const baselineY = valueToY(0, domain);\n    const drawZeroLine = domain.min < 0 && domain.max > 0;\n\n    const plotPoints = toPlotPoints(this.validData, domain, { width });\n    const symbolIndices = calculateSymbolIndices(this.validData, {\n      first: this.denoteFirst,\n      last: this.denoteLast,\n      min: this.denoteMin,\n      max: this.denoteMax\n    });\n    const interpolation = toInterpolation(this.interpolation);\n\n    const linePath = toLinePath(plotPoints, interpolation, width);\n    const drawArea = this.mark === 'area' || this.mark === 'gradient';\n    const areaPath = drawArea ? toAreaPath(plotPoints, interpolation, VIEW_HEIGHT) : '';\n\n    return svg`\n      <svg viewBox=\"0 0 ${width} ${height}\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden=\"true\">\n        ${this.mark === 'gradient' ? this.#renderGradientDef(height) : nothing}\n\n        ${\n          areaPath.length\n            ? this.mark === 'gradient'\n              ? svg`<path class=\"area\" d=${areaPath} style=\"fill: url(#gradient)\"></path>`\n              : svg`<path class=\"area\" d=${areaPath}></path>`\n            : nothing\n        }\n\n        ${drawZeroLine ? this.#renderZeroLine(baselineY, width) : nothing}\n\n        ${linePath ? svg`<path class=\"line\" d=${linePath} vector-effect=\"non-scaling-stroke\"></path>` : nothing}\n      </svg>\n      ${this.#renderAccents(plotPoints, symbolIndices)}\n    `;\n  }\n\n  #renderGradientDef(height: number) {\n    return svg`\n      <defs>\n        <linearGradient id=\"gradient\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"${height}\" gradientUnits=\"userSpaceOnUse\">\n          <stop offset=\"0%\" style=\"stop-color: var(--gradient-max-color)\"></stop>\n          <stop offset=\"100%\" style=\"stop-color: var(--gradient-min-color)\"></stop>\n        </linearGradient>\n      </defs>\n    `;\n  }\n\n  #renderZeroLine(position: number, width: number) {\n    return svg`\n      <line\n        class=\"zero-line\"\n        vector-effect=\"non-scaling-stroke\"\n        x1=\"0\"\n        y1=\"${position.toFixed(PRECISION)}\"\n        x2=\"${width}\"\n        y2=\"${position.toFixed(PRECISION)}\">\n      </line>\n    `;\n  }\n\n  #renderAccents(points: Point[], accentIndices: Set<number>) {\n    if (points.length === 0 || accentIndices.size === 0) return nothing;\n\n    return html`\n      ${Array.from(accentIndices).map(index => {\n        const point = points[index];\n        if (!point) return nothing;\n\n        const style = `--x: ${point.x.toFixed(PRECISION)}; --y: ${point.y.toFixed(PRECISION)}`;\n        return html`\n          <span style=${style} class=\"accent\"></span>\n        `;\n      })}\n    `;\n  }\n\n  #renderColumn(width: number, height: number) {\n    const domain = calculateDomain(this.validData, {\n      explicitMin: this.min,\n      explicitMax: this.max,\n      includeZero: true\n    });\n    if (!domain) return nothing;\n\n    const baselineY = valueToY(0, domain);\n    const showZeroLine = domain.min < 0 && domain.max > 0;\n    const plotPoints = toPlotPoints(this.validData, domain, { width });\n    const rects = toColumnRects(plotPoints, baselineY, width);\n\n    return svg`\n      <svg viewBox=\"0 0 ${width} ${height}\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden=\"true\">\n        ${showZeroLine ? this.#renderZeroLine(baselineY, width) : nothing}\n\n        ${rects.map(rect => {\n          return svg`<rect class=\"column\" x=\"${rect.x.toFixed(PRECISION)}\" y=\"${rect.y.toFixed(PRECISION)}\" width=\"${rect.width.toFixed(PRECISION)}\" height=\"${rect.height.toFixed(PRECISION)}\"></rect>`;\n        })}\n      </svg>\n    `;\n  }\n\n  #renderWinLoss(baselineY: number, width: number, height: number) {\n    if (this.validData.length === 0) return nothing;\n\n    const rects = toWinLossRects(this.validData, baselineY, { width, height });\n\n    return svg`\n      <svg viewBox=\"0 0 ${width} ${height}\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden=\"true\">\n        ${this.#renderZeroLine(baselineY, width)}\n\n        ${rects.map(rect => {\n          return svg`<rect class=\"${rect.className}\" x=\"${rect.x.toFixed(PRECISION)}\" y=\"${rect.y.toFixed(PRECISION)}\" width=\"${rect.width.toFixed(PRECISION)}\" height=\"${rect.height.toFixed(PRECISION)}\"></rect>`;\n        })}\n      </svg>\n    `;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"sparkline2.js","names":["styles","_decorate","__decorate","sparkline_default","Sparkline","LitElement","_args","useStyles","statusStateStyles","supportStateStyles","#renderChart","attachInternals","changedProperties","toValidData","calculateViewBox","#renderLineVariant","width","height","#renderColumn","#renderWinLoss","nothing","props","aspectRatio","validAspectRatio","domain","calculateDomain","baselineY","valueToY","drawZeroLine","plotPoints","toPlotPoints","symbolIndices","calculateSymbolIndices","interpolation","toInterpolation","linePath","toLinePath","areaPath","toAreaPath","#renderGradientDef","#renderZeroLine","#renderAccents","position","points","accentIndices","point","index","style","showZeroLine","rects","toColumnRects","rect","toWinLossRects","property","state"],"sources":["../../src/sparkline/sparkline.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues, SVGTemplateResult } from 'lit';\nimport { html, LitElement, nothing, svg } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport type {\n  DataElement,\n  Interpolation,\n  Point,\n  SizeExpanded,\n  SparklineMark,\n  SupportStatus,\n  TaskStatus\n} from '@nvidia-elements/core/internal';\nimport { statusStateStyles, supportStateStyles } from '@nvidia-elements/core/internal';\nimport { attachInternals } from '@nvidia-elements/foundations/internal/a11y';\nimport { useStyles } from '@nvidia-elements/foundations/internal/styles';\nimport {\n  calculateDomain,\n  calculateSymbolIndices,\n  calculateViewBox,\n  PRECISION,\n  toAreaPath,\n  toColumnRects,\n  toInterpolation,\n  toLinePath,\n  toPlotPoints,\n  toValidData,\n  toWinLossRects,\n  valueToY,\n  VIEW_HEIGHT\n} from './sparkline.utils.js';\nimport styles from './sparkline.css?inline';\n\n/**\n * @element nve-sparkline\n * @description A sparkline is a compact, word-sized chart with typographic scale, for data-dense layouts (text, tables, cards, dashboards).\n * @documentation https://nvidia.github.io/elements/docs/elements/sparkline/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/sparkline\n * @cssprop --height - Height (defaults to 1em and scales with parent font-size).\n * @cssprop --line-color\n * @cssprop --line-width\n * @cssprop --fill-color - Color used by area and column marks.\n * @cssprop --gradient-max-color\n * @cssprop --gradient-min-color\n * @cssprop --zero-line-color\n * @cssprop --zero-line-width\n * @cssprop --win-color  Color used to represent positive values (wins).\n * @cssprop --loss-color Color used to represent negative values (losses).\n * @cssprop --draw-color Color used to represent zero values (draws / neutral outcomes).\n * @cssprop --symbol-color\n * @cssprop --symbol-border-color\n * @cssprop --symbol-border-width\n * @cssprop --symbol-radius - symbol circle radius in SVG units.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img\n */\nexport class Sparkline extends LitElement implements DataElement<number[]> {\n  static styles = useStyles([styles, statusStateStyles, supportStateStyles]);\n\n  static readonly metadata = {\n    tag: 'nve-sparkline',\n    version: '0.0.0'\n  };\n\n  /** Numeric values representing a data series. */\n  @property({ type: Array }) data: number[] = [];\n\n  /** Controls the visual representation of data points. */\n  @property({ type: String }) mark: SparklineMark = 'line';\n\n  /** Controls how the chart connects intermediate values between points in a data series. Defaults to `linear`. */\n  @property({ type: String }) interpolation: Interpolation = 'linear';\n\n  /** Applies semantic status colors used across Elements status patterns. */\n  @property({ type: String, reflect: true }) status?: TaskStatus | SupportStatus;\n\n  /** Controls the sparkline size with explicit font-size tokens. Omit to auto-scale with parent font-size (1em). */\n  @property({ type: String, reflect: true }) size?: SizeExpanded;\n\n  /** Denotes the first data point by rendering a symbol at its position. */\n  @property({ type: Boolean, attribute: 'denote-first', reflect: true })\n  denoteFirst = false;\n\n  /** Denotes the last data point by rendering a symbol at its position. */\n  @property({ type: Boolean, attribute: 'denote-last', reflect: true })\n  denoteLast = false;\n\n  /** Denotes all minimum-value data points by rendering symbols at their positions. */\n  @property({ type: Boolean, attribute: 'denote-min', reflect: true })\n  denoteMin = false;\n\n  /** Denotes all maximum-value data points by rendering symbols at their positions. */\n  @property({ type: Boolean, attribute: 'denote-max', reflect: true })\n  denoteMax = false;\n\n  /** Controls spacing between points in a line, in em (1 = chart height). Defaults to `0.6`. */\n  @property({ type: Number, attribute: 'interval-length' }) intervalLength = 0.6;\n\n  /** Lower bound for the y-axis domain. When undefined, derives the bound from data. */\n  @property({ type: Number }) min?: number;\n\n  /** Upper bound for the y-axis domain. When undefined, derives the bound from data. */\n  @property({ type: Number }) max?: number;\n\n  /** Cached valid numeric values derived from data property. */\n  @state() private validData: number[] = [];\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`<div internal-host>${this.#renderChart()}</div>`;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'img';\n  }\n\n  willUpdate(changedProperties: PropertyValues<this>) {\n    super.willUpdate(changedProperties);\n\n    if (changedProperties.has('data')) {\n      this.validData = toValidData(this.data);\n    }\n  }\n\n  #renderChart(): SVGTemplateResult | typeof nothing {\n    const { width, height } = calculateViewBox(this.mark, this.validData.length, this.intervalLength);\n\n    switch (this.mark) {\n      case 'line':\n      case 'area':\n      case 'gradient':\n        return this.#renderLineVariant(width, height);\n      case 'column':\n        return this.#renderColumn(width, height);\n      case 'winloss':\n        return this.#renderWinLoss(VIEW_HEIGHT / 2, width, height);\n      default:\n        const _exhaustiveCheck: never = this.mark;\n        return nothing;\n    }\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n\n    const { width, height } = calculateViewBox(this.mark, this.validData.length, this.intervalLength);\n    const aspectRatio = width / height;\n    const validAspectRatio = Number.isFinite(aspectRatio) && aspectRatio > 0 ? aspectRatio : 1;\n    this.style.setProperty('--_aspect-ratio', validAspectRatio.toFixed(4));\n  }\n\n  #renderLineVariant(width: number, height: number) {\n    const domain = calculateDomain(this.validData, { explicitMin: this.min, explicitMax: this.max });\n    if (!domain) return nothing;\n\n    const baselineY = valueToY(0, domain);\n    const drawZeroLine = domain.min < 0 && domain.max > 0;\n\n    const plotPoints = toPlotPoints(this.validData, domain, { width });\n    const symbolIndices = calculateSymbolIndices(this.validData, {\n      first: this.denoteFirst,\n      last: this.denoteLast,\n      min: this.denoteMin,\n      max: this.denoteMax\n    });\n    const interpolation = toInterpolation(this.interpolation);\n\n    const linePath = toLinePath(plotPoints, interpolation, width);\n    const drawArea = this.mark === 'area' || this.mark === 'gradient';\n    const areaPath = drawArea ? toAreaPath(plotPoints, interpolation, VIEW_HEIGHT) : '';\n\n    return svg`\n      <svg viewBox=\"0 0 ${width} ${height}\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden=\"true\">\n        ${this.mark === 'gradient' ? this.#renderGradientDef(height) : nothing}\n\n        ${\n          areaPath.length\n            ? this.mark === 'gradient'\n              ? svg`<path class=\"area\" d=${areaPath} style=\"fill: url(#gradient)\"></path>`\n              : svg`<path class=\"area\" d=${areaPath}></path>`\n            : nothing\n        }\n\n        ${drawZeroLine ? this.#renderZeroLine(baselineY, width) : nothing}\n\n        ${linePath ? svg`<path class=\"line\" d=${linePath} vector-effect=\"non-scaling-stroke\"></path>` : nothing}\n      </svg>\n      ${this.#renderAccents(plotPoints, symbolIndices)}\n    `;\n  }\n\n  #renderGradientDef(height: number) {\n    return svg`\n      <defs>\n        <linearGradient id=\"gradient\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"${height}\" gradientUnits=\"userSpaceOnUse\">\n          <stop offset=\"0%\" style=\"stop-color: var(--gradient-max-color)\"></stop>\n          <stop offset=\"100%\" style=\"stop-color: var(--gradient-min-color)\"></stop>\n        </linearGradient>\n      </defs>\n    `;\n  }\n\n  #renderZeroLine(position: number, width: number) {\n    return svg`\n      <line\n        class=\"zero-line\"\n        vector-effect=\"non-scaling-stroke\"\n        x1=\"0\"\n        y1=\"${position.toFixed(PRECISION)}\"\n        x2=\"${width}\"\n        y2=\"${position.toFixed(PRECISION)}\">\n      </line>\n    `;\n  }\n\n  #renderAccents(points: Point[], accentIndices: Set<number>) {\n    if (points.length === 0 || accentIndices.size === 0) return nothing;\n\n    return html`\n      ${Array.from(accentIndices).map(index => {\n        const point = points[index];\n        if (!point) return nothing;\n\n        const style = `--x: ${point.x.toFixed(PRECISION)}; --y: ${point.y.toFixed(PRECISION)}`;\n        return html`\n          <span style=${style} class=\"accent\"></span>\n        `;\n      })}\n    `;\n  }\n\n  #renderColumn(width: number, height: number) {\n    const domain = calculateDomain(this.validData, {\n      explicitMin: this.min,\n      explicitMax: this.max,\n      includeZero: true\n    });\n    if (!domain) return nothing;\n\n    const baselineY = valueToY(0, domain);\n    const showZeroLine = domain.min < 0 && domain.max > 0;\n    const plotPoints = toPlotPoints(this.validData, domain, { width });\n    const rects = toColumnRects(plotPoints, baselineY, width);\n\n    return svg`\n      <svg viewBox=\"0 0 ${width} ${height}\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden=\"true\">\n        ${showZeroLine ? this.#renderZeroLine(baselineY, width) : nothing}\n\n        ${rects.map(rect => {\n          return svg`<rect class=\"column\" x=\"${rect.x.toFixed(PRECISION)}\" y=\"${rect.y.toFixed(PRECISION)}\" width=\"${rect.width.toFixed(PRECISION)}\" height=\"${rect.height.toFixed(PRECISION)}\"></rect>`;\n        })}\n      </svg>\n    `;\n  }\n\n  #renderWinLoss(baselineY: number, width: number, height: number) {\n    if (this.validData.length === 0) return nothing;\n\n    const rects = toWinLossRects(this.validData, baselineY, { width, height });\n\n    return svg`\n      <svg viewBox=\"0 0 ${width} ${height}\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden=\"true\">\n        ${this.#renderZeroLine(baselineY, width)}\n\n        ${rects.map(rect => {\n          return svg`<rect class=\"${rect.className}\" x=\"${rect.x.toFixed(PRECISION)}\" y=\"${rect.y.toFixed(PRECISION)}\" width=\"${rect.width.toFixed(PRECISION)}\" height=\"${rect.height.toFixed(PRECISION)}\"></rect>`;\n        })}\n      </svg>\n    `;\n  }\n}\n"],"mappings":"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"}

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

@@ -1,28 +1,28 @@
 import { getElementUpdate as e } from "../internal/utils/dom.js";
-import { scopedRegistry as t } from "../internal/decorators/scoped-registry.js";
-import { useStyles as n } from "../internal/styles/index.js";
-import r from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
-import { Icon as i } from "../icon/icon2.js";
-import { Control as a } from "../forms/control/control2.js";
-import o from "./star-rating.js";
-import { html as s } from "lit";
+import t from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import { Icon as n } from "../icon/icon2.js";
+import { Control as r } from "../forms/control/control2.js";
+import i from "./star-rating.js";
+import { html as a } from "lit";
+import { scopedRegistry as o } from "@nvidia-elements/foundations/internal/decorators";
+import { useStyles as s } from "@nvidia-elements/foundations/internal/styles";
 import { state as c } from "lit/decorators/state.js";
 // src/star-rating/star-rating.ts
-var l = class extends a {
+var l = class extends r {
 	constructor(...e) {
 		super(...e), this.min = 0, this.max = 5, this.value = 0, this.active = 0, this.precision = .5;
 	}
 	static {
-		this.styles = n([...a.styles, o]);
+		this.styles = s([...r.styles, i]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-star-rating",
-			version: "2.23.4"
+			version: "2.23.6"
 		};
 	}
 	static {
-		this.elementDefinitions = { [i.metadata.tag]: i };
+		this.elementDefinitions = { [n.metadata.tag]: n };
 	}
 	firstUpdated(t) {
 		super.firstUpdated(t), e(this.input, "max", (e) => {
@@ -34,9 +34,9 @@ var l = class extends a {
 		}), this.input.addEventListener("input", () => this.value = this.input.valueAsNumber), this.value = this.input.valueAsNumber;
 	}
 	get prefixContent() {
-		return s`<div aria-hidden="true" class="stars" @mouseleave="${() => this.active = 0}">${Array(this.max).fill("").map((e, t) => {
+		return a`<div aria-hidden="true" class="stars" @mouseleave="${() => this.active = 0}">${Array(this.max).fill("").map((e, t) => {
 			let n = t + 1, r = (this.active || this.value) - t;
-			return s`<nve-icon part="icon" @click="${() => this.#n(this.#t(t, n))}" @mousemove="${(e) => this.#e(e, t, n)}" name="${r >= 1 ? "star" : r >= .5 ? "star-half" : "star-stroke"}"></nve-icon>`;
+			return a`<nve-icon part="icon" @click="${() => this.#n(this.#t(t, n))}" @mousemove="${(e) => this.#e(e, t, n)}" name="${r >= 1 ? "star" : r >= .5 ? "star-half" : "star-stroke"}"></nve-icon>`;
 		})}</div>`;
 	}
 	#e(e, t, n) {
@@ -50,7 +50,7 @@ var l = class extends a {
 		this.input.valueAsNumber = e === this.value ? 0 : e, this.input.dispatchEvent(new Event("input", { bubbles: !0 })), this.input.dispatchEvent(new Event("change", { bubbles: !0 }));
 	}
 };
-r([c()], l.prototype, "min", void 0), r([c()], l.prototype, "max", void 0), r([c()], l.prototype, "value", void 0), r([c()], l.prototype, "active", void 0), r([c()], l.prototype, "precision", void 0), l = r([t()], l);
+t([c()], l.prototype, "min", void 0), t([c()], l.prototype, "max", void 0), t([c()], l.prototype, "value", void 0), t([c()], l.prototype, "active", void 0), t([c()], l.prototype, "precision", void 0), l = t([o()], l);
 export { l as StarRating };
 
 //# sourceMappingURL=star-rating2.js.map