@nvidia-elements/core 2.19.0 → 2.20.0

package/dist/badge/badge2.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge2.js","names":[],"sources":["../../src/badge/badge.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport type { TaskStatus, SupportStatus, Color, Prominence } from '@nvidia-elements/core/internal';\nimport {\n  useStyles,\n  statusIcons,\n  statusStateStyles,\n  supportStateStyles,\n  colorStateStyles,\n  attachInternals,\n  I18nController,\n  typeSSR,\n  scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport styles from './badge.css?inline';\n\n/**\n * @element nve-badge\n * @description A visual indicator that communicates a status description of an associated component. Status badges use short text, color, built in icons for quick recognition and render near the relevant content.\n * @documentation https://nvidia.github.io/elements/docs/elements/badge/\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/badge\n * @slot - Short text that communicates the badge status.\n * @slot prefix-icon - slot for prefix icon\n * @slot suffix-icon - slot for suffix icon\n * @cssprop --background\n * @cssprop --color\n * @cssprop --gap\n * @cssprop --font-size\n * @cssprop --icon-color\n * @cssprop --padding\n * @cssprop --border\n * @cssprop --border-radius\n * @cssprop --font-weight\n * @cssprop --text-transform\n * @cssprop --width\n * @cssprop --height\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img\n */\n@typeSSR()\n@scopedRegistry()\nexport class Badge extends LitElement {\n  /**\n   * Visual treatment to represent a ongoing task, support status.\n   */\n  @property({ type: String, reflect: true }) status: TaskStatus | SupportStatus;\n\n  /**\n   * Highlights content to draw attention and convey simple messages.\n   */\n  @property({ type: String, reflect: true }) color: Color;\n\n  /**\n   * Determines the container styles of component. Flat suits nesting within other containers.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  /** Determines the visual prominence or weight */\n  @property({ type: String, reflect: true }) prominence?: Extract<Prominence, 'emphasis'>;\n\n  static styles = useStyles([styles, statusStateStyles, supportStateStyles, colorStateStyles]);\n\n  static readonly metadata = {\n    tag: 'nve-badge',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  get #size() {\n    return this.status && statusIcons[this.status] === 'dot' ? 'sm' : 'md';\n  }\n\n  /** @private */\n  declare _internals: ElementInternals;\n\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  render() {\n    return html`\n      <div internal-host>\n        <slot name=\"prefix-icon\">${this.status ? html`<nve-icon part=\"_icon\" .name=${statusIcons[this.status] ?? ''} .size=${this.#size} aria-hidden=\"true\"></nve-icon>` : nothing}</slot>\n        <slot @slotchange=${this.#slotChange}></slot>\n        <slot name=\"suffix-icon\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'status';\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this.#assignAriaLabel();\n  }\n\n  #slotChange() {\n    this.#assignAriaLabel();\n    this.#assignDefaultIcon();\n  }\n\n  #assignAriaLabel() {\n    this._internals.ariaLabel = this.textContent;\n  }\n\n  #assignDefaultIcon() {\n    const unassignedIcon = this.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!\n      .assignedElements()\n      .find(i => i.matches('nve-icon') && !i.slot);\n    if (unassignedIcon) {\n      unassignedIcon.slot = 'prefix-icon';\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;AA8CO,IAAM,IAAN,cAAoB,EAAW;;EA0CD,aALK,KAAA,KAAA,IAAI,EAAqB,IAAI,GAKlC,KAAA,OAAA,KAAK,GAAgB;;;EAvBxC,KAAA,SAAA,EAAU;GAAC;GAAQ;GAAmB;GAAoB;EAAgB,CAAC;;;EAEhE,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAK,SAAS,MAAM,EACvB;;CAEA,IAAI,KAAQ;EACV,OAAO,KAAK,UAAU,EAAY,KAAK,YAAY,QAAQ,OAAO;CACpE;CAKA;CAOA,SAAS;EACP,OAAO,CAAI,+CAEoB,KAAK,SAAS,CAAI,iCAAgC,EAAY,KAAK,WAAW,GAAG,WAAS,KAAK,GAAM,oCAAmC,EAAQ,4BACvJ,KAAK,GAAY;CAI3C;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO;CACzB;CAEA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQ,CAAK,GACnB,KAAK,GAAiB;CACxB;CAEA,KAAc;EAEZ,AADA,KAAK,GAAiB,GACtB,KAAK,GAAmB;CAC1B;CAEA,KAAmB;EACjB,KAAK,WAAW,YAAY,KAAK;CACnC;CAEA,KAAqB;EACnB,IAAM,IAAiB,KAAK,WAAY,cAA+B,kBAAkB,CAAC,CACvF,iBAAiB,CAAC,CAClB,MAAK,MAAK,EAAE,QAAQ,UAAU,KAAK,CAAC,EAAE,IAAI;EAC7C,AAAI,MACF,EAAe,OAAO;CAE1B;AACF;AA9EG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,GAyBxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GA5C3B,IAAA,EAAA,CAAA,EAAQ,GACR,EAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"badge2.js","names":[],"sources":["../../src/badge/badge.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport type { TaskStatus, SupportStatus, Color, Prominence } from '@nvidia-elements/core/internal';\nimport {\n  useStyles,\n  statusIcons,\n  statusStateStyles,\n  supportStateStyles,\n  colorStateStyles,\n  attachInternals,\n  typeSSR,\n  scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport styles from './badge.css?inline';\n\n/**\n * @element nve-badge\n * @description A visual indicator that communicates a status description of an associated component. Status badges use short text, color, built in icons for quick recognition and render near the relevant content.\n * @documentation https://nvidia.github.io/elements/docs/elements/badge/\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/badge\n * @slot - Short text that communicates the badge status.\n * @slot prefix-icon - slot for prefix icon\n * @slot suffix-icon - slot for suffix icon\n * @cssprop --background\n * @cssprop --color\n * @cssprop --gap\n * @cssprop --font-size\n * @cssprop --icon-color\n * @cssprop --padding\n * @cssprop --border\n * @cssprop --border-radius\n * @cssprop --font-weight\n * @cssprop --text-transform\n * @cssprop --width\n * @cssprop --height\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img\n */\n@typeSSR()\n@scopedRegistry()\nexport class Badge extends LitElement {\n  /**\n   * Visual treatment to represent a ongoing task, support status.\n   */\n  @property({ type: String, reflect: true }) status: TaskStatus | SupportStatus;\n\n  /**\n   * Highlights content to draw attention and convey simple messages.\n   */\n  @property({ type: String, reflect: true }) color: Color;\n\n  /**\n   * Determines the container styles of component. Flat suits nesting within other containers.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  /** Determines the visual prominence or weight */\n  @property({ type: String, reflect: true }) prominence?: Extract<Prominence, 'emphasis'>;\n\n  static styles = useStyles([styles, statusStateStyles, supportStateStyles, colorStateStyles]);\n\n  static readonly metadata = {\n    tag: 'nve-badge',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  get #size() {\n    return this.status && statusIcons[this.status] === 'dot' ? 'sm' : 'md';\n  }\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot name=\"prefix-icon\">${this.status ? html`<nve-icon part=\"_icon\" .name=${statusIcons[this.status] ?? ''} .size=${this.#size} aria-hidden=\"true\"></nve-icon>` : nothing}</slot>\n        <slot @slotchange=${this.#slotChange}></slot>\n        <slot name=\"suffix-icon\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'status';\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this.#assignAriaLabel();\n  }\n\n  #slotChange() {\n    this.#assignAriaLabel();\n    this.#assignDefaultIcon();\n  }\n\n  #assignAriaLabel() {\n    this._internals.ariaLabel = this.textContent;\n  }\n\n  #assignDefaultIcon() {\n    const unassignedIcon = this.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!\n      .assignedElements()\n      .find(i => i.matches('nve-icon') && !i.slot);\n    if (unassignedIcon) {\n      unassignedIcon.slot = 'prefix-icon';\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;AA6CO,IAAM,IAAN,cAAoB,EAAW;;EAmBpB,KAAA,SAAA,EAAU;GAAC;GAAQ;GAAmB;GAAoB;EAAgB,CAAC;;;EAEhE,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;;EAE4B,KAAA,qBAAA,GACzB,EAAK,SAAS,MAAM,EACvB;;CAEA,IAAI,KAAQ;EACV,OAAO,KAAK,UAAU,EAAY,KAAK,YAAY,QAAQ,OAAO;CACpE;CAKA,SAAS;EACP,OAAO,CAAI,+CAEoB,KAAK,SAAS,CAAI,iCAAgC,EAAY,KAAK,WAAW,GAAG,WAAS,KAAK,GAAM,oCAAmC,EAAQ,4BACvJ,KAAK,GAAY;CAI3C;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO;CACzB;CAEA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQ,CAAK,GACnB,KAAK,GAAiB;CACxB;CAEA,KAAc;EAEZ,AADA,KAAK,GAAiB,GACtB,KAAK,GAAmB;CAC1B;CAEA,KAAmB;EACjB,KAAK,WAAW,YAAY,KAAK;CACnC;CAEA,KAAqB;EACnB,IAAM,IAAiB,KAAK,WAAY,cAA+B,kBAAkB,CAAC,CACvF,iBAAiB,CAAC,CAClB,MAAK,MAAK,EAAE,QAAQ,UAAU,KAAK,CAAC,EAAE,IAAI;EAC7C,AAAI,MACF,EAAe,OAAO;CAE1B;AACF;AAvEG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,GAKxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,KAAA,CAAA,GAnB1C,IAAA,EAAA,CAAA,EAAQ,GACR,EAAe,CAAA,GAAA,CAAA"}

package/dist/breadcrumb/breadcrumb2.js

@@ -24,7 +24,7 @@ var m = class extends u {
 	static {
 		this.metadata = {
 			tag: "nve-breadcrumb",
-			version: "2.19.0"
+			version: "2.20.0"
 		};
 	}
 	static {

package/dist/bundle.d.ts

@@ -34,6 +34,7 @@ import '@nvidia-elements/core/icon/define.js';
 import '@nvidia-elements/core/icon-button/define.js';
 import '@nvidia-elements/core/iframe/define.js';
 import '@nvidia-elements/core/input/define.js';
+import '@nvidia-elements/core/joystick/define.js';
 import '@nvidia-elements/core/logo/define.js';
 import '@nvidia-elements/core/menu/define.js';
 import '@nvidia-elements/core/month/define.js';
@@ -107,6 +108,7 @@ export * from '@nvidia-elements/core/icon';
 export * from '@nvidia-elements/core/icon-button';
 export * from '@nvidia-elements/core/iframe';
 export * from '@nvidia-elements/core/input';
+export * from '@nvidia-elements/core/joystick';
 export * from '@nvidia-elements/core/logo';
 export * from '@nvidia-elements/core/menu';
 export * from '@nvidia-elements/core/month';

package/dist/bundles/index.d.ts

@@ -78,6 +78,20 @@ export interface RenderOptions {
 	 */
 	isConnected?: boolean;
 }
+export interface KeynavListConfig {
+	items: NodeListOf<HTMLElement> | HTMLElement[];
+	initialItem?: HTMLElement;
+	layout?: "both" | "horizontal" | "vertical";
+	manageFocus?: boolean;
+	manageTabindex?: boolean;
+	loop?: boolean;
+	dir?: string | null;
+}
+export interface StateScrollConfig {
+	target?: HTMLElement;
+	scrollOffset?: number;
+}
+export type IconName = "placeholder" | "caret" | "person" | "menu" | "cancel" | "gear" | "chevron" | "logout" | "copy" | "more-actions" | "add" | "arrow" | "delete" | "download" | "search" | "split-vertical" | "sparkles" | "branch" | "refresh" | "double-chevron" | "academic-cap" | "add-asset" | "add-comment" | "add-grid" | "add-user" | "ancestors" | "archive" | "arrow-angle" | "arrow-both" | "arrow-cycle" | "arrow-path-rounded-square" | "arrow-stop" | "at-symbol" | "backspace" | "bar-pill-stack" | "bars-3" | "bars-3-bottom-left" | "bars-3-bottom-right" | "bars-3-center-left" | "bars-4" | "beaker" | "bell" | "bell-slash" | "bold" | "book" | "bookmark" | "bounding-box" | "briefcase" | "broadcast" | "browser" | "bug" | "calendar" | "camera" | "carets-closed-square" | "carousel" | "category-list" | "chart-bar" | "chat-bubble" | "chat-bubbles" | "check" | "check-badge" | "checklist" | "checkmark-circle" | "chip" | "circle" | "circle-angled-line" | "circle-dash" | "circle-dot" | "circle-dot-arrows" | "circle-half" | "circle-rule" | "circle-tick" | "clipboard" | "clock" | "clock-circle-arrow" | "cloud" | "cloud-download" | "cloud-upload" | "code" | "collapse-all" | "collapse-details" | "color-palette" | "columns" | "compare" | "computer" | "connect-node" | "connected-blocks" | "cross-hairs" | "cursor-rays" | "cursor-ripples" | "data-management" | "delete-node" | "doc-checkmark" | "dock-bottom" | "dock-none" | "dock-side" | "document" | "document-clipboard" | "dot" | "drag" | "dropper" | "duplicate" | "edit" | "ellipses" | "envelope" | "exclamation-circle" | "exclamation-mark" | "exclamation-triangle" | "expand-all" | "expand-details" | "expression" | "eye" | "eye-hidden" | "face-frown" | "face-smile" | "fast-forward" | "fast-forward-10" | "film" | "filter" | "flag" | "fold" | "folder" | "fork" | "globe" | "globe-alt" | "group" | "group-boxes" | "hand" | "hash" | "heading" | "home" | "horizontal-rule" | "hourglass" | "hourglass-end" | "hourglass-mid" | "hourglass-start" | "identification" | "image" | "inbox" | "infinity" | "information-circle" | "inspect" | "italic" | "key" | "keyboard" | "laptop-phone" | "layers" | "lifebuoy" | "lightbulb" | "lightning-bolt" | "link" | "list-ordered" | "list-unordered" | "lock" | "login" | "looping" | "looping-off" | "map" | "map-drives" | "map-pin" | "markdown" | "maximize" | "megaphone" | "merge" | "meter" | "minimize" | "minus" | "minus-circle" | "moon" | "multiselect" | "music-note" | "newspaper" | "not-allowed" | "numbers" | "office-building" | "outline" | "paper-airplane" | "paper-clip" | "pause" | "pencil-square" | "person-2" | "person-3" | "person-circle" | "phone" | "picture-in-picture" | "pie-chart" | "pin" | "pizza-slice" | "play" | "plug" | "plus-circle" | "plus-minus" | "pointer" | "priority-high" | "priority-low" | "priority-medium" | "projector" | "pull-close" | "pull-draft" | "pull-open" | "pulse" | "puzzle-piece" | "question-mark-circle" | "rectangle-group" | "rectangle-stack-horizontal" | "rectangle-stack-vertical" | "redo" | "reply" | "rewind" | "rewind-10" | "rocketship" | "running" | "scale" | "scissors" | "sensor" | "server" | "server-stack" | "shapes" | "share" | "signal" | "signal-slash" | "signpost" | "sort-ascending" | "sort-descending" | "soundwave" | "split-horizontal" | "split-none" | "star" | "star-half" | "star-stroke" | "start" | "status-offline" | "status-online" | "stop" | "stop-sign" | "stopwatch" | "strikethrough" | "sun" | "swatch" | "switch" | "switch-apps" | "table" | "tag" | "task" | "telescope" | "template" | "terminal" | "thumb" | "traffic-cone" | "transparent-box" | "trend-down" | "trend-up" | "trophy" | "truck" | "typography" | "undo" | "unlock" | "upload" | "video-camera" | "view-as-grid" | "volume" | "volume-muted" | "wifi" | "wrench" | "x-circle" | "zoom-in" | "zoom-out";
 export interface I18nStrings {
 	close: string;
 	copy: string;
@@ -134,21 +148,13 @@ export interface I18nStrings {
 	seekToStart: string;
 	unmuteMedia: string;
 	volume: string;
+	joystickPosition: string;
+	joystickNoPosition: string;
+	joystickInstructions: string;
+	joystickHoldInstructions: string;
+	joystickReturnedToCenter: string;
 }
-export interface KeynavListConfig {
-	items: NodeListOf<HTMLElement> | HTMLElement[];
-	initialItem?: HTMLElement;
-	layout?: "both" | "horizontal" | "vertical";
-	manageFocus?: boolean;
-	manageTabindex?: boolean;
-	loop?: boolean;
-	dir?: string | null;
-}
-export interface StateScrollConfig {
-	target?: HTMLElement;
-	scrollOffset?: number;
-}
-export type IconName = "placeholder" | "caret" | "person" | "menu" | "cancel" | "gear" | "chevron" | "logout" | "copy" | "more-actions" | "add" | "arrow" | "delete" | "download" | "search" | "split-vertical" | "sparkles" | "branch" | "refresh" | "double-chevron" | "academic-cap" | "add-asset" | "add-comment" | "add-grid" | "add-user" | "ancestors" | "archive" | "arrow-angle" | "arrow-both" | "arrow-cycle" | "arrow-path-rounded-square" | "arrow-stop" | "at-symbol" | "backspace" | "bar-pill-stack" | "bars-3" | "bars-3-bottom-left" | "bars-3-bottom-right" | "bars-3-center-left" | "bars-4" | "beaker" | "bell" | "bell-slash" | "bold" | "book" | "bookmark" | "bounding-box" | "briefcase" | "broadcast" | "browser" | "bug" | "calendar" | "camera" | "carets-closed-square" | "carousel" | "category-list" | "chart-bar" | "chat-bubble" | "chat-bubbles" | "check" | "check-badge" | "checklist" | "checkmark-circle" | "chip" | "circle" | "circle-angled-line" | "circle-dash" | "circle-dot" | "circle-dot-arrows" | "circle-half" | "circle-rule" | "circle-tick" | "clipboard" | "clock" | "clock-circle-arrow" | "cloud" | "cloud-download" | "cloud-upload" | "code" | "collapse-all" | "collapse-details" | "color-palette" | "columns" | "compare" | "computer" | "connect-node" | "connected-blocks" | "cross-hairs" | "cursor-rays" | "cursor-ripples" | "data-management" | "delete-node" | "doc-checkmark" | "dock-bottom" | "dock-none" | "dock-side" | "document" | "document-clipboard" | "dot" | "drag" | "dropper" | "duplicate" | "edit" | "ellipses" | "envelope" | "exclamation-circle" | "exclamation-mark" | "exclamation-triangle" | "expand-all" | "expand-details" | "expression" | "eye" | "eye-hidden" | "face-frown" | "face-smile" | "fast-forward" | "fast-forward-10" | "film" | "filter" | "flag" | "fold" | "folder" | "fork" | "globe" | "globe-alt" | "group" | "group-boxes" | "hand" | "hash" | "heading" | "home" | "horizontal-rule" | "hourglass" | "hourglass-end" | "hourglass-mid" | "hourglass-start" | "identification" | "image" | "inbox" | "infinity" | "information-circle" | "inspect" | "italic" | "key" | "keyboard" | "laptop-phone" | "layers" | "lifebuoy" | "lightbulb" | "lightning-bolt" | "link" | "list-ordered" | "list-unordered" | "lock" | "login" | "looping" | "looping-off" | "map" | "map-drives" | "map-pin" | "markdown" | "maximize" | "megaphone" | "merge" | "meter" | "minimize" | "minus" | "minus-circle" | "moon" | "multiselect" | "music-note" | "newspaper" | "not-allowed" | "numbers" | "office-building" | "outline" | "paper-airplane" | "paper-clip" | "pause" | "pencil-square" | "person-2" | "person-3" | "person-circle" | "phone" | "picture-in-picture" | "pie-chart" | "pin" | "pizza-slice" | "play" | "plug" | "plus-circle" | "plus-minus" | "pointer" | "priority-high" | "priority-low" | "priority-medium" | "projector" | "pull-close" | "pull-draft" | "pull-open" | "pulse" | "puzzle-piece" | "question-mark-circle" | "rectangle-group" | "rectangle-stack-horizontal" | "rectangle-stack-vertical" | "redo" | "reply" | "rewind" | "rewind-10" | "rocketship" | "running" | "scale" | "scissors" | "sensor" | "server" | "server-stack" | "shapes" | "share" | "signal" | "signal-slash" | "signpost" | "sort-ascending" | "sort-descending" | "soundwave" | "split-horizontal" | "split-none" | "star" | "star-half" | "star-stroke" | "start" | "status-offline" | "status-online" | "stop" | "stop-sign" | "stopwatch" | "strikethrough" | "sun" | "swatch" | "switch" | "switch-apps" | "table" | "tag" | "task" | "telescope" | "template" | "terminal" | "thumb" | "traffic-cone" | "transparent-box" | "trend-down" | "trend-up" | "trophy" | "truck" | "typography" | "undo" | "unlock" | "upload" | "video-camera" | "view-as-grid" | "volume" | "volume-muted" | "wifi" | "wrench" | "x-circle" | "zoom-in" | "zoom-out";
+export type I18nDefaults = Readonly<Partial<I18nStrings>>;
 export type Color = "red-cardinal" | "gray-slate" | "gray-denim" | "blue-indigo" | "blue-cobalt" | "blue-sky" | "teal-cyan" | "green-mint" | "teal-seafoam" | "green-grass" | "yellow-amber" | "orange-pumpkin" | "red-tomato" | "pink-magenta" | "purple-plum" | "purple-violet" | "purple-lavender" | "pink-rose" | "green-jade" | "lime-pear" | "yellow-nova" | "brand-green";
 /** Controls the visual scale of an element to match its importance and available space.
  * - `sm` - Compact size for dense layouts or secondary elements with less visual prominence.
@@ -1450,12 +1456,6 @@ export declare class Badge extends LitElement {
 	};
 	/** @private */
 	_internals: ElementInternals;
-	/**
-	 * Enables updating internal string values for internationalization.
-	 */
-	i18n: Partial<I18nStrings & {
-		__set: boolean;
-	}>;
 	render(): TemplateResult<1>;
 	connectedCallback(): void;
 	updated(props: PropertyValues<this>): void;
@@ -1698,6 +1698,8 @@ export declare class Control extends LitElement {
 	fitText: boolean;
 	/** Sets the input to match native default content block */
 	fitContent: boolean;
+	/** Component-specific defaults supplied by a derived control. */
+	protected get i18nDefaults(): I18nDefaults;
 	/** Enables internal string values to update for internationalization. */
 	i18n: Partial<I18nStrings & {
 		__set: boolean;
@@ -1857,6 +1859,7 @@ export declare class CheckboxGroup extends ControlGroup {
  */
 declare class Color$1 extends Control implements ContainerElement {
 	#private;
+	protected get i18nDefaults(): I18nDefaults;
 	/**
 	 * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
 	 * Use when embedding within another container such as a toolbar.
@@ -2215,6 +2218,7 @@ export declare class Tag extends Tag_base {
  */
 export declare class Combobox extends Control implements ContainerElement {
 	#private;
+	protected get i18nDefaults(): I18nDefaults;
 	/**
 	 * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
 	 * Use when embedding within another container such as a toolbar.
@@ -2491,6 +2495,7 @@ export declare class CopyButton extends Button {
  * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date
  */
 declare class Date$1 extends Control implements ContainerElement {
+	protected get i18nDefaults(): I18nDefaults;
 	/**
 	 * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
 	 * Use when embedding within another container such as a toolbar.
@@ -2529,6 +2534,7 @@ declare class Date$1 extends Control implements ContainerElement {
  * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local
  */
 export declare class Datetime extends Control implements ContainerElement {
+	protected get i18nDefaults(): I18nDefaults;
 	/**
 	 * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
 	 * Use when embedding within another container such as a toolbar.
@@ -3726,6 +3732,129 @@ export declare class InputGroup extends ControlGroup {
 	};
 	connectedCallback(): Promise<void>;
 }
+export interface JoystickValue {
+	readonly x: number;
+	readonly y: number;
+}
+export type JoystickConstraint = "circle" | "square" | "horizontal" | "vertical";
+export type JoystickRelease = "center" | "hold";
+export interface JoystickInteractionStart {
+	readonly source: "pointer" | "keyboard";
+}
+export interface JoystickInteractionEnd extends JoystickInteractionStart {
+	readonly reason: "release" | "escape" | "pointer-cancel" | "lost-capture" | "blur" | "hidden" | "disabled" | "readonly" | "configuration-change" | "reset" | "disconnect";
+}
+declare const Joystick_base: FormControlMixinReturn<typeof LitElement, JoystickValue>;
+/**
+ * @element nve-joystick
+ * @description A joystick selects a normalized two-axis vector with pointer or keyboard input.
+ * Applications own physical units, coordinate frames, input shaping, publishing cadence, recording clocks,
+ * command-outcome feedback, and alternative controls when needed.
+ *
+ * Give each joystick an accessible name with a label, aria-label, or aria-labelledby.
+ * Editable controls use the application role to receive two-axis keyboard input.
+ * The default accessible description includes both normalized coordinates, keyboard instructions, and release behavior.
+ * A locked axis stays at zero; an absent value reads "No position." Disabled and read-only controls omit instructions.
+ * Coordinates use up to six decimal places and the document language for number formatting.
+ * An explicit aria-description or aria-describedby replaces the default focus description through standard ARIA precedence;
+ * it does not disable live announcements.
+ * @documentation https://nvidia.github.io/elements/docs/elements/joystick/
+ * @since 0.0.0
+ * @entrypoint \@nvidia-elements/core/joystick
+ * @property {JoystickValue | undefined} value - The normalized vector: positive x points right and positive y points down, independent of text direction. Assign a complete finite object within the selected constraint. Invalid vectors throw TypeError without replacing the previous value. Programmatic writes do not dispatch input or change events. Use undefined for an absent sample and a zero vector for recorded neutral input. Set readOnly before assigning replay ownership. User input can replace external writes during an interaction.
+ * @attribute {string} value - A JSON object containing normalized x and y coordinates.
+ * @event input - Dispatched after user input changes the vector, including a return to neutral. Read .value for the current vector. A held position does not generate repeated events. Publish commands at an application-controlled cadence.
+ * @event change - Dispatched after a normal interaction completes and produces input. Cancellation sends any necessary neutral input without change.
+ * @event interaction-start - Dispatched with the pointer or keyboard source after setting :state(active), including engagement at neutral.
+ * @event interaction-end - Dispatched with the source and terminal reason after clearing :state(active). Interruption first sends any necessary neutral input. Reset restores the declared default without value events. Detached events cannot bubble to former ancestors.
+ * @cssprop --width
+ * @cssprop --height
+ * @cssprop --background
+ * @cssprop --opacity - Background opacity when the opacity flag is present. Defaults to 0.6. The border, crosshair, thumb, and focus indicator keep their opacity.
+ * @cssprop --border
+ * @cssprop --thumb-width
+ * @cssprop --thumb-height
+ * @cssprop --thumb-background
+ * @cssprop --thumb-border
+ * @stable false
+ */
+export declare class Joystick extends Joystick_base {
+	#private;
+	static styles: CSSResult[];
+	static readonly metadata: {
+		tag: string;
+		version: string;
+		valueSchema: {
+			type: "object";
+			properties: {
+				x: {
+					type: "number";
+					minimum: number;
+					maximum: number;
+				};
+				y: {
+					type: "number";
+					minimum: number;
+					maximum: number;
+				};
+			};
+			required: string[];
+			additionalProperties: boolean;
+		};
+	};
+	/**
+	 * Constrains the movement region or selects one axis. Circle limits vector magnitude to one;
+	 * square permits both axes at full scale and a magnitude of up to Math.SQRT2.
+	 * With equally scaled planar velocity axes, square corners allow about 41% greater speed.
+	 * Mixed forward-velocity and turning-rate axes have no common physical magnitude.
+	 * Changing the constraint projects the current value silently and cancels an active interaction.
+	 */
+	constraint: JoystickConstraint;
+	/** Sets surface and thumb size. At the default font size, sm is 104px, md is 130px, and lg is 156px. */
+	size: Size;
+	/** Enables background transparency using the --opacity CSS custom property. */
+	opacity: boolean;
+	/**
+	 * Determines whether normal release returns to center or holds the final vector.
+	 * Interrupted interactions return to neutral in either mode. Form reset restores the declared default instead.
+	 */
+	release: JoystickRelease;
+	/**
+	 * Sets the normalized increment for each arrow key press. Repeated presses continue adjusting;
+	 * releasing the final arrow applies the release behavior. Escape cancels the interaction.
+	 * Invalid steps fall back to 0.1. Modifier shortcuts and locked-axis directions remain available to the browser.
+	 */
+	keyboardStep: number;
+	/**
+	 * Controls automatic position announcements. Focused user input produces polite announcements at most every 500 ms.
+	 * A quick tap in center mode reports the input coordinates and the return to center.
+	 * Escape announces the resulting coordinates without a separate cancellation message.
+	 * Programmatic writes and read-only playback update the description without live announcements.
+	 * Set off when the application supplies spoken output, the position description on focus remains available.
+	 */
+	announce: "polite" | "off";
+	/** Enables updating internal string values for internationalization. */
+	i18n: Partial<I18nStrings & {
+		__set: boolean;
+	}>;
+	static get observedAttributes(): string[];
+	attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+	get disabled(): boolean;
+	set disabled(value: boolean | unknown);
+	get readOnly(): boolean;
+	set readOnly(value: boolean | unknown);
+	constructor();
+	connectedCallback(): void;
+	disconnectedCallback(): void;
+	firstUpdated(): void;
+	willUpdate(changes: PropertyValues<this>): void;
+	updated(): void;
+	render(): TemplateResult<1>;
+	updateValue(value: JoystickValue): void;
+	reset(): void;
+	formStateRestoreCallback(state: unknown, _reason?: string): void;
+	_updateFormState(): void;
+}
 /**
  * @element nve-logo
  * @description A visual indicator for a brand or application.
@@ -3778,6 +3907,7 @@ export declare class Logo extends LitElement {
  * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/month
  */
 export declare class Month extends Control implements ContainerElement {
+	protected get i18nDefaults(): I18nDefaults;
 	/**
 	 * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
 	 * Use when embedding within another container such as a toolbar.
@@ -4004,17 +4134,10 @@ export declare class Page extends LitElement {
  *
  */
 export declare class PagePanel extends LitElement {
-	#private;
 	/**
 	 * Sets the max size of the panel.
 	 */
 	size?: Size;
-	/**
-	 * Enables updating internal string values for internationalization.
-	 */
-	i18n: Partial<I18nStrings & {
-		__set: boolean;
-	}>;
 	static styles: CSSResult[];
 	static readonly metadata: {
 		tag: string;
@@ -4485,6 +4608,7 @@ export declare class Panel extends LitElement {
  */
 export declare class Password extends Control implements ContainerElement {
 	#private;
+	protected get i18nDefaults(): I18nDefaults;
 	/**
 	 * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
 	 * Use when embedding within another container such as a toolbar.
@@ -5394,6 +5518,7 @@ export declare class Textarea extends Control {
  * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time
  */
 export declare class Time extends Control implements ContainerElement {
+	protected get i18nDefaults(): I18nDefaults;
 	/**
 	 * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
 	 * Use when embedding within another container such as a toolbar.
@@ -5764,6 +5889,7 @@ export declare class Tree extends LitElement {
  * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/week
  */
 export declare class Week extends Control implements ContainerElement {
+	protected get i18nDefaults(): I18nDefaults;
 	/**
 	 * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
 	 * Use when embedding within another container such as a toolbar.