@nvidia-elements/core 0.2.2 → 0.2.3

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/mixin';\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\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 * @since 1.23.7\n * @entrypoint \\@nvidia-elements/core/preferences-input\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":["#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\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 * @since 1.23.7\n * @entrypoint \\@nvidia-elements/core/preferences-input\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 { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { scopedRegistry as t } from "../internal/decorators/scoped-registry.js";
-import { useStyles as n } from "../internal/styles/index.js";
+import { scopedRegistry as e } from "../internal/decorators/scoped-registry.js";
+import { useStyles as t } from "../internal/styles/index.js";
+import { __decorate as n } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/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";
@@ -11,12 +11,12 @@ var c = class extends i {
 		super(...e), this.max = 100;
 	}
 	static {
-		this.styles = n([r]);
+		this.styles = t([r]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-progress-bar",
-			version: "0.2.2"
+			version: "0.2.3"
 		};
 	}
 	render() {
@@ -28,13 +28,13 @@ var c = class extends i {
 		return a`<progress internal-host .max="${this.max}" .value="${this.value === void 0 ? 100 : this.value}" class="${s(e)}"></progress>`;
 	}
 };
-e([o({
+n([o({
 	type: Number,
 	reflect: !0
-})], c.prototype, "value", void 0), e([o({ type: Number })], c.prototype, "max", void 0), e([o({
+})], c.prototype, "value", void 0), n([o({ type: Number })], c.prototype, "max", void 0), n([o({
 	type: String,
 	reflect: !0
-})], c.prototype, "status", void 0), c = e([t()], c);
+})], c.prototype, "status", void 0), c = n([e()], c);
 //#endregion
 export { c as ProgressBar };
 

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

@@ -1,9 +1,9 @@
-import { attachInternals as e } from "../internal/utils/a11y.js";
-import { __decorate as t } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { I18nController as n } from "../internal/controllers/i18n.controller.js";
-import { scopedRegistry as r } from "../internal/decorators/scoped-registry.js";
-import { useStyles as i } from "../internal/styles/index.js";
-import { statusIcons as a } from "../internal/types/index.js";
+import { I18nController as e } from "../internal/controllers/i18n.controller.js";
+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 { __decorate as a } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/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";
@@ -11,16 +11,16 @@ import { property as u } from "lit/decorators/property.js";
 import { queryAssignedElements as d } from "lit/decorators/query-assigned-elements.js";
 //#region src/progress-ring/progress-ring.ts
 var f = class extends c {
-	constructor(...e) {
-		super(...e), this.max = 100, this.status = "neutral", this.#e = new n(this), this.i18n = this.#e.i18n, this.#t = !1;
+	constructor(...t) {
+		super(...t), this.max = 100, this.status = "neutral", this.#e = new e(this), this.i18n = this.#e.i18n, this.#t = !1;
 	}
 	static {
-		this.styles = i([s]);
+		this.styles = r([s]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-progress-ring",
-			version: "0.2.2"
+			version: "0.2.3"
 		};
 	}
 	static {
@@ -29,10 +29,10 @@ var f = class extends c {
 	#e;
 	#t;
 	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" && !this.#t ? l`<nve-icon part="icon" .name="${this.status ? a[this.status] : void 0}" .status="${this.status}" aria-hidden="true"></nve-icon>` : ""}</slot><slot name="status-icon" @slotchange="${this.#n}"></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="ring" stroke-dasharray="${`${(this.value ?? 0) / (this.max ?? 100) * 44}px 44px`}"></circle></svg><slot>${this.status !== "accent" && !this.#t ? l`<nve-icon part="icon" .name="${this.status ? i[this.status] : void 0}" .status="${this.status}" aria-hidden="true"></nve-icon>` : ""}</slot><slot name="status-icon" @slotchange="${this.#n}"></slot></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), e(this), this._internals.role = "progressbar";
+		super.connectedCallback(), t(this), this._internals.role = "progressbar";
 	}
 	updated(e) {
 		super.updated(e), this._internals.ariaValueNow = `${this.value === void 0 ? "" : this.value}`, this._internals.ariaValueMax = `${this.max}`;
@@ -43,13 +43,13 @@ var f = class extends c {
 		this.#t = this._deprecatedStatusIconSlot.length > 0, this.requestUpdate();
 	}
 };
-t([u({ type: Number })], f.prototype, "value", void 0), t([u({ type: Number })], f.prototype, "max", void 0), t([u({
+a([u({ type: Number })], f.prototype, "value", void 0), a([u({ type: Number })], f.prototype, "max", void 0), a([u({
 	type: String,
 	reflect: !0
-})], f.prototype, "status", void 0), t([u({
+})], f.prototype, "status", void 0), a([u({
 	type: String,
 	reflect: !0
-})], f.prototype, "size", void 0), t([u({ type: Object })], f.prototype, "i18n", void 0), t([d({ slot: "status-icon" })], f.prototype, "_deprecatedStatusIconSlot", void 0), f = t([r()], f);
+})], f.prototype, "size", void 0), a([u({ type: Object })], f.prototype, "i18n", void 0), a([d({ slot: "status-icon" })], f.prototype, "_deprecatedStatusIconSlot", void 0), f = a([n()], f);
 //#endregion
 export { f as ProgressRing };
 

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

@@ -1,11 +1,11 @@
-import { appendRootNodeStyle as e, generateId as t } from "../internal/utils/dom.js";
-import { attachInternals as n } from "../internal/utils/a11y.js";
-import { __decorate as r } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { I18nController as i } from "../internal/controllers/i18n.controller.js";
-import { TypeClosableController as a } from "../internal/controllers/type-closable.controller.js";
-import { typeSSR as o } from "../internal/controllers/type-ssr.controller.js";
-import { scopedRegistry as s } from "../internal/decorators/scoped-registry.js";
-import { useStyles as c } from "../internal/styles/index.js";
+import { I18nController as e } from "../internal/controllers/i18n.controller.js";
+import { appendRootNodeStyle as t, generateId as n } from "../internal/utils/dom.js";
+import { attachInternals as r } from "../internal/utils/a11y.js";
+import { TypeClosableController as i } from "../internal/controllers/type-closable.controller.js";
+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 { __decorate as c } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/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";
@@ -17,13 +17,13 @@ import { property as v } from "lit/decorators/property.js";
 import { state as y } from "lit/decorators/state.js";
 //#region src/progressive-filter-chip/progressive-filter-chip.ts
 var b = class extends h {
-	constructor(...e) {
-		super(...e), this.#e = new i(this), this.i18n = this.#e.i18n, this.inputs = [], this.#t = new a(this);
+	constructor(...t) {
+		super(...t), this.#e = new e(this), this.i18n = this.#e.i18n, this.inputs = [], this.#t = new i(this);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-progressive-filter-chip",
-			version: "0.2.2"
+			version: "0.2.3"
 		};
 	}
 	static {
@@ -36,7 +36,7 @@ var b = class extends h {
 	}
 	#e;
 	static {
-		this.styles = c([m]);
+		this.styles = s([m]);
 	}
 	#t;
 	#n(e) {
@@ -47,7 +47,7 @@ var b = class extends h {
 		return g`<div internal-host>${this.inputs.map((e) => this.#n(e))} ${this.closable ? g`<nve-icon-button part="icon-button" exportparts="icon:icon-button-icon" @click="${() => this.#t.close()}" .ariaLabel="${this.i18n.close}" icon-name="cancel"></nve-icon-button>` : _}</div><slot hidden-slot @slotchange="${this.#i}"></slot>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), n(this), this._internals.role = "toolbar", this.setAttribute("nve-control", ""), e(this, p);
+		super.connectedCallback(), r(this), this._internals.role = "toolbar", this.setAttribute("nve-control", ""), t(this, p);
 	}
 	#r(e) {
 		e.target.assignedElements().length || this.#a();
@@ -56,14 +56,14 @@ var b = class extends h {
 		if (e.target && e.target.assignedElements().length) {
 			this.#a();
 			let e = Array.from(this.shadowRoot.querySelector("slot:not([name])").assignedElements()).filter((e) => e.matches("input, select, nve-button, [nve-control]"));
-			e.forEach((e) => e.slot = t()), this.inputs = e.length ? e : this.inputs;
+			e.forEach((e) => e.slot = n()), this.inputs = e.length ? e : this.inputs;
 		}
 	}
 	#a() {
 		Array.from(this.shadowRoot.querySelectorAll("slot")).flatMap((e) => e.assignedElements()).forEach((e) => e.slot = "");
 	}
 };
-r([v({ type: Boolean })], b.prototype, "closable", void 0), r([v({ type: Object })], b.prototype, "i18n", void 0), r([y()], b.prototype, "inputs", void 0), b = r([o(), s()], b);
+c([v({ type: Boolean })], b.prototype, "closable", void 0), c([v({ type: Object })], b.prototype, "i18n", void 0), c([y()], b.prototype, "inputs", void 0), b = c([a(), o()], b);
 //#endregion
 export { b as ProgressiveFilterChip };
 

package/dist/pulse/pulse2.js

@@ -1,6 +1,6 @@
 import { attachInternals as e } from "../internal/utils/a11y.js";
-import { __decorate as t } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { useStyles as n } from "../internal/styles/index.js";
+import { useStyles as t } from "../internal/styles/index.js";
+import { __decorate as n } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
 import { Icon as r } from "../icon/icon2.js";
 import i from "./pulse.js";
 import { LitElement as a, html as o } from "lit";
@@ -8,12 +8,12 @@ import { property as s } from "lit/decorators/property.js";
 //#region src/pulse/pulse.ts
 var c = class extends a {
 	static {
-		this.styles = n([i]);
+		this.styles = t([i]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-pulse",
-			version: "0.2.2"
+			version: "0.2.3"
 		};
 	}
 	static {
@@ -26,10 +26,10 @@ var c = class extends a {
 		return o`<svg internal-host width="100%" height="100%" viewBox="0 0 200 200"><circle class="circle" cx="100" cy="100" r="25"></circle><circle class="circle c1" cx="100" cy="100" r="25"></circle><circle class="circle c2" cx="100" cy="100" r="25"></circle><circle class="circle c3" cx="100" cy="100" r="25"></circle></svg>`;
 	}
 };
-t([s({
+n([s({
 	type: String,
 	reflect: !0
-})], c.prototype, "size", void 0), t([s({
+})], c.prototype, "size", void 0), n([s({
 	type: String,
 	reflect: !0
 })], c.prototype, "status", void 0);

package/dist/radio/radio-group2.js

@@ -1,18 +1,18 @@
-import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { audit as t } from "../internal/controllers/audit.controller.js";
-import { typeSSR as n } from "../internal/controllers/type-ssr.controller.js";
-import { useStyles as r } from "../internal/styles/index.js";
+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 { __decorate as r } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/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
 var o = class extends i {
 	static {
-		this.styles = r([...i.styles, a]);
+		this.styles = n([...i.styles, a]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-radio-group",
-			version: "0.2.2",
+			version: "0.2.3",
 			children: [
 				"label",
 				"nve-control-message",
@@ -21,7 +21,7 @@ var o = class extends i {
 		};
 	}
 };
-o = e([t(), n()], o);
+o = r([e(), t()], o);
 //#endregion
 export { o as RadioGroup };
 

package/dist/radio/radio2.js

@@ -1,7 +1,7 @@
-import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { audit as t } from "../internal/controllers/audit.controller.js";
-import { hostAttr as n } from "../internal/decorators/host-attr.js";
-import { useStyles as r } from "../internal/styles/index.js";
+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 { __decorate as r } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
 import { Control as i } from "../forms/control/control2.js";
 import a from "./radio.js";
 //#region src/radio/radio.ts
@@ -10,12 +10,12 @@ var o = class extends i {
 		super(...e), this.nveControl = "inline";
 	}
 	static {
-		this.styles = r([...i.styles, a]);
+		this.styles = n([...i.styles, a]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-radio",
-			version: "0.2.2",
+			version: "0.2.3",
 			children: [
 				"label",
 				"input",
@@ -24,7 +24,7 @@ var o = class extends i {
 		};
 	}
 };
-e([n({ attribute: "nve-control" })], o.prototype, "nveControl", void 0), o = e([t()], o);
+r([t({ attribute: "nve-control" })], o.prototype, "nveControl", void 0), o = r([e()], o);
 //#endregion
 export { o as Radio };
 

package/dist/range/range2.js

@@ -1,6 +1,6 @@
 import { appendRootNodeStyle as e, getElementUpdate as t } from "../internal/utils/dom.js";
-import { __decorate as n } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { useStyles as r } from "../internal/styles/index.js";
+import { useStyles as n } from "../internal/styles/index.js";
+import { __decorate as r } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
 import { Control as i } from "../forms/control/control2.js";
 import a from "./range.global.js";
 import o from "./range.js";
@@ -12,12 +12,12 @@ var d = class extends i {
 		super(...e), this.orientation = "horizontal";
 	}
 	static {
-		this.styles = r([...i.styles, o]);
+		this.styles = n([...i.styles, o]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-range",
-			version: "0.2.2"
+			version: "0.2.3"
 		};
 	}
 	connectedCallback() {
@@ -45,7 +45,7 @@ var d = class extends i {
 		})}</div>`;
 	}
 };
-n([u({
+r([u({
 	type: String,
 	reflect: !0
 })], d.prototype, "orientation", void 0);