@nvidia-elements/core 0.0.1 → 0.0.3

package/dist/input/input2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input2.js","names":[],"sources":["../../src/input/input.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { CSSResult } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport type { ContainerElement } from '@nvidia-elements/core/internal';\nimport { useStyles } from '@nvidia-elements/core/internal';\nimport { Control } from '@nvidia-elements/core/forms';\nimport styles from './input.css?inline';\n\nexport const inputStyles = styles;\n\n/**\n * @element nve-input\n * @description An input is a control that enables users to enter text.\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/input\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --border\n * @cssprop --cursor\n * @cssprop --color\n * @cssprop --font-weight\n * @cssprop --width\n * @cssprop --min-width\n * @cssprop --max-width\n * @cssprop --border-bottom\n * @cssprop --box-shadow\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input\n */\nexport class Input extends Control implements ContainerElement {\n  /**\n   * Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.\n   * Use when embedding within another container such as a toolbar.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat';\n\n  /**\n   * Sets the rounded visual style of the input.\n   */\n  @property({ type: Boolean, reflect: true }) rounded = false;\n\n  static styles: CSSResult[] = useStyles([...Control.styles, styles]);\n\n  static readonly metadata = {\n    tag: 'nve-input',\n    version: '0.0.0'\n  };\n}\n"],"mappings":";;;;;;AAUA,IAAa,IAAc,GAuBd,IAAb,cAA2B,EAAoC;;8BAUP;;;gBAEzB,EAAU,CAAC,GAAG,EAAQ,QAAQ,EAAO,CAAC;;;kBAExC;GACzB,KAAK;GACL,SAAS;GACV;;;GAZA,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,aAAA,KAAA,EAAA,KAKzC,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,WAAA,KAAA,EAAA"}

package/dist/internal/base/button.d.ts

@@ -0,0 +1,109 @@
+import { LitElement } from 'lit';
+/**
+ * Standard button behaviors for custom elements.
+ * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
+ * @aria https://www.w3.org/WAI/ARIA/apg/patterns/button/
+ */
+export declare class BaseButton extends LitElement {
+    #private;
+    static formAssociated: boolean;
+    /**
+     * Use for toggle button types.
+     * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed
+     */
+    pressed: boolean;
+    /**
+     * Use for buttons that expand/collapse content.
+     * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded
+     */
+    expanded: boolean;
+    /**
+     * Like input readonly, sets a button semantically as visual treatment only
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly
+     */
+    readonly: boolean;
+    /**
+     * Like input form, sets a button to submit a form outside its parent form.
+     * Returns a reference to the form element if available.
+     * https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form
+     */
+    set form(form: string | HTMLFormElement);
+    get form(): HTMLFormElement | null | string;
+    /**
+     * The name of the button, submitted as a pair with the button's value as part of the form data, when that button submits the form.
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name
+     */
+    name: string;
+    /**
+     * Defines the value associated with the button's name when submitting the form data. The server receives this value in params when the form submits through this button.
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-value
+     */
+    value: string;
+    /**
+     * Defines the button behavior when associated within an <form> element.
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type
+     */
+    type: 'button' | 'submit' | 'reset';
+    /**
+     * This Boolean attribute prevents the user from interacting with the button: it cannot receive press or focus events.
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-disabled
+     */
+    disabled: boolean;
+    /**
+     * This Boolean attribute prevents the selected state when the button belongs to a multi-choice selection group
+     * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected
+     */
+    selected: boolean;
+    /**
+     * This Boolean attribute sets the current state, used to represent the current page or navigation link
+     * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current
+     */
+    current: 'page' | 'step';
+    /**
+     * Establishing a relationship between a popover and its invoker button.
+     * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement
+     */
+    popoverTargetElement: HTMLElement | null;
+    /**
+     * The idref of the element that receives the popover.
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/button#popovertarget
+     */
+    popovertarget: string;
+    /**
+     * The popover target action to perform on the popover target element.
+     * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction
+     */
+    popoverTargetAction: 'show' | 'hide' | 'toggle';
+    /**
+     * The element that receives the command.
+     * https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API
+     */
+    commandForElement: HTMLElement | null;
+    /**
+     * The idref of the element that receives the command.
+     * https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API
+     */
+    commandfor: string | null;
+    /**
+     * The command to execute on the element.
+     * https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API
+     */
+    command: string;
+    /**
+     * The element that receives the interest.
+     * https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement
+     */
+    interestForElement: HTMLElement | null;
+    /**
+     * The idref of the element that receives the interest.
+     * https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement
+     */
+    interestfor: string | null;
+    /**
+     * @private
+     * An instance of `ElementInternals` that decorators/controllers set dynamically
+     */
+    _internals: ElementInternals;
+    connectedCallback(): void;
+    render(): import('lit-html').TemplateResult<1>;
+}

package/dist/internal/base/button.js

@@ -0,0 +1,110 @@
+import { attachInternals as e } from "../utils/a11y.js";
+import { stateActive as t } from "../controllers/state-active.controller.js";
+import { stateDisabled as n } from "../controllers/state-disabled.controller.js";
+import { stateExpanded as r } from "../controllers/state-expanded.controller.js";
+import { statePressed as i } from "../controllers/state-pressed.controller.js";
+import { stateSelected as a } from "../controllers/state-selected.controller.js";
+import { typeButton as o } from "../controllers/type-button.controller.js";
+import { typeAnchor as s } from "../controllers/type-anchor.controller.js";
+import { typeSubmit as c } from "../controllers/type-submit.controller.js";
+import { typeNativePopoverTrigger as l } from "../controllers/type-native-popover-trigger.controller.js";
+import { stateCurrent as u } from "../controllers/state-current.controller.js";
+import { typeCommand as d } from "../controllers/type-command.controller.js";
+import { typeInterest as f } from "../controllers/type-interest.controller.js";
+import { __decorate as p } from "../../_virtual/_@oxc-project_runtime@0.123.0/helpers/decorate.js";
+import { LitElement as m, html as h, isServer as g } from "lit";
+import { property as _ } from "lit/decorators/property.js";
+//#region src/internal/base/button.ts
+var v = class extends m {
+	constructor(...e) {
+		super(...e), this.disabled = !1, this.popoverTargetElement = null, this.commandForElement = null, this.commandfor = null, this.interestForElement = null, this.interestfor = null;
+	}
+	static {
+		this.formAssociated = !0;
+	}
+	#e = null;
+	set form(e) {
+		this.#e = e, typeof e == "string" ? this.setAttribute("form", e) : this.removeAttribute("form");
+	}
+	get form() {
+		if (this.#e && typeof this.#e != "string") return this.#e;
+		if (typeof this.#e == "string" && !g) {
+			let e = this.getRootNode();
+			return e.getElementById ? e.getElementById(this.#e) : null;
+		} else return this._internals?.form;
+	}
+	connectedCallback() {
+		super.connectedCallback(), e(this);
+	}
+	render() {
+		return h`<div internal-host><slot></slot></div>`;
+	}
+};
+p([_({
+	type: Boolean,
+	reflect: !0
+})], v.prototype, "pressed", void 0), p([_({
+	type: Boolean,
+	reflect: !0
+})], v.prototype, "expanded", void 0), p([_({
+	type: Boolean,
+	reflect: !0
+})], v.prototype, "readonly", void 0), p([_({
+	type: String,
+	attribute: "form",
+	converter: { fromAttribute: (e) => e }
+})], v.prototype, "form", null), p([_({
+	type: String,
+	reflect: !0
+})], v.prototype, "name", void 0), p([_({
+	type: String,
+	reflect: !0
+})], v.prototype, "value", void 0), p([_({
+	type: String,
+	reflect: !0
+})], v.prototype, "type", void 0), p([_({
+	type: Boolean,
+	reflect: !0
+})], v.prototype, "disabled", void 0), p([_({
+	type: Boolean,
+	reflect: !0
+})], v.prototype, "selected", void 0), p([_({
+	type: String,
+	reflect: !0
+})], v.prototype, "current", void 0), p([_({ type: Object })], v.prototype, "popoverTargetElement", void 0), p([_({
+	type: String,
+	attribute: "popovertarget",
+	reflect: !0
+})], v.prototype, "popovertarget", void 0), p([_({
+	type: String,
+	attribute: "popovertargetaction",
+	reflect: !0
+})], v.prototype, "popoverTargetAction", void 0), p([_({ type: Object })], v.prototype, "commandForElement", void 0), p([_({
+	type: String,
+	attribute: "commandfor",
+	reflect: !0
+})], v.prototype, "commandfor", void 0), p([_({
+	type: String,
+	attribute: "command",
+	reflect: !0
+})], v.prototype, "command", void 0), p([_({ type: Object })], v.prototype, "interestForElement", void 0), p([_({
+	type: String,
+	reflect: !0
+})], v.prototype, "interestfor", void 0), v = p([
+	o(),
+	s(),
+	c(),
+	l(),
+	d(),
+	f(),
+	t(),
+	u(),
+	i(),
+	a(),
+	n(),
+	r()
+], v);
+//#endregion
+export { v as BaseButton };
+
+//# sourceMappingURL=button.js.map

package/dist/internal/base/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","names":["#form"],"sources":["../../../src/internal/base/button.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 { stateActive } from '../controllers/state-active.controller.js';\nimport { stateDisabled } from '../controllers/state-disabled.controller.js';\nimport { stateExpanded } from '../controllers/state-expanded.controller.js';\nimport { statePressed } from '../controllers/state-pressed.controller.js';\nimport { stateSelected } from '../controllers/state-selected.controller.js';\nimport { typeButton } from '../controllers/type-button.controller.js';\nimport { typeAnchor } from '../controllers/type-anchor.controller.js';\nimport { typeSubmit } from '../controllers/type-submit.controller.js';\nimport { typeNativePopoverTrigger } from '../controllers/type-native-popover-trigger.controller.js';\nimport { stateCurrent } from '../controllers/state-current.controller.js';\nimport { typeCommand } from '../controllers/type-command.controller.js';\nimport { attachInternals } from '../utils/a11y.js';\nimport { typeInterest } from '../controllers/type-interest.controller.js';\n\n/**\n * Standard button behaviors for custom elements.\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/button/\n */\n@typeButton<BaseButton>()\n@typeAnchor<BaseButton>()\n@typeSubmit<BaseButton & { form: HTMLFormElement | null }>() // override to exclude type string from getter, see comment in getter below\n@typeNativePopoverTrigger<BaseButton>()\n@typeCommand<BaseButton>()\n@typeInterest<BaseButton>()\n@stateActive<BaseButton>()\n@stateCurrent<BaseButton>()\n@statePressed<BaseButton>()\n@stateSelected<BaseButton>()\n@stateDisabled<BaseButton>()\n@stateExpanded<BaseButton>()\nexport class BaseButton extends LitElement {\n  static formAssociated = true;\n\n  /**\n   * Use for toggle button types.\n   * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed\n   */\n  @property({ type: Boolean, reflect: true }) pressed: boolean;\n\n  /**\n   * Use for buttons that expand/collapse content.\n   * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded\n   */\n  @property({ type: Boolean, reflect: true }) expanded: boolean;\n\n  /**\n   * Like input readonly, sets a button semantically as visual treatment only\n   * https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly\n   */\n  @property({ type: Boolean, reflect: true }) readonly: boolean;\n\n  #form: string | HTMLFormElement | null = null;\n\n  /**\n   * Like input form, sets a button to submit a form outside its parent form.\n   * Returns a reference to the form element if available.\n   * https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form\n   */\n  @property({\n    type: String,\n    attribute: 'form',\n    converter: {\n      fromAttribute: (value: string) => value\n    }\n  })\n  set form(form: string | HTMLFormElement) {\n    this.#form = form;\n    if (typeof form === 'string') {\n      this.setAttribute('form', form);\n    } else {\n      this.removeAttribute('form');\n    }\n  }\n\n  // eslint-disable-next-line @typescript-eslint/related-getter-setter-pairs\n  get form(): HTMLFormElement | null | string {\n    // string should drop from the type but without it the type does not derive from the setter correctly\n    if (this.#form && typeof this.#form !== 'string') {\n      return this.#form;\n    } else if (typeof this.#form === 'string' && !isServer) {\n      const rootNode = this.getRootNode() as Document | ShadowRoot;\n      return rootNode.getElementById ? (rootNode.getElementById(this.#form) as HTMLFormElement) : null;\n    } else {\n      return this._internals?.form;\n    }\n  }\n\n  /**\n   * The name of the button, submitted as a pair with the button's value as part of the form data, when that button submits the form.\n   * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name\n   */\n  @property({ type: String, reflect: true }) name: string;\n\n  /**\n   * Defines the value associated with the button's name when submitting the form data. The server receives this value in params when the form submits through this button.\n   * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-value\n   */\n  @property({ type: String, reflect: true }) value: string;\n\n  /**\n   * Defines the button behavior when associated within an <form> element.\n   * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type\n   */\n  @property({ type: String, reflect: true }) type: 'button' | 'submit' | 'reset';\n\n  /**\n   * This Boolean attribute prevents the user from interacting with the button: it cannot receive press or focus events.\n   * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-disabled\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /**\n   * This Boolean attribute prevents the selected state when the button belongs to a multi-choice selection group\n   * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected\n   */\n  @property({ type: Boolean, reflect: true }) selected: boolean;\n\n  /**\n   * This Boolean attribute sets the current state, used to represent the current page or navigation link\n   * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current\n   */\n  @property({ type: String, reflect: true }) current: 'page' | 'step';\n\n  /**\n   * Establishing a relationship between a popover and its invoker button.\n   * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement\n   */\n  @property({ type: Object }) popoverTargetElement: HTMLElement | null = null; // eslint-disable-line local/primitive-property\n\n  /**\n   * The idref of the element that receives the popover.\n   * https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/button#popovertarget\n   */\n  @property({ type: String, attribute: 'popovertarget', reflect: true }) popovertarget: string;\n\n  /**\n   * The popover target action to perform on the popover target element.\n   * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction\n   */\n  @property({ type: String, attribute: 'popovertargetaction', reflect: true })\n  popoverTargetAction: 'show' | 'hide' | 'toggle';\n\n  /**\n   * The element that receives the command.\n   * https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API\n   */\n  @property({ type: Object }) commandForElement: HTMLElement | null = null; // eslint-disable-line local/primitive-property\n\n  /**\n   * The idref of the element that receives the command.\n   * https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API\n   */\n  @property({ type: String, attribute: 'commandfor', reflect: true }) commandfor: string | null = null;\n\n  /**\n   * The command to execute on the element.\n   * https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API\n   */\n  @property({ type: String, attribute: 'command', reflect: true }) command: string;\n\n  /**\n   * The element that receives the interest.\n   * https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement\n   */\n  @property({ type: Object }) interestForElement: HTMLElement | null = null; // eslint-disable-line local/primitive-property\n\n  /**\n   * The idref of the element that receives the interest.\n   * https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement\n   */\n  @property({ type: String, reflect: true }) interestfor: string | null = null;\n\n  /**\n   * @private\n   * An instance of `ElementInternals` that decorators/controllers set dynamically\n   */\n  declare _internals: ElementInternals;\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n  }\n\n  render() {\n    return html`<div internal-host><slot></slot></div>`;\n  }\n}\n"],"mappings":"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"}

package/dist/internal/controllers/audit.controller.d.ts

@@ -0,0 +1,24 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+export declare const excessiveInstanceLimit = 50;
+export interface AuditOptions {
+    excessiveInstanceLimit?: number;
+    alternates?: {
+        name: string;
+        use: string;
+    }[];
+}
+export interface AuditMetadata {
+    parents?: string[];
+    children?: string[];
+    disallowedChildren?: string[];
+}
+export declare function audit<T extends Audit>(options?: AuditOptions): ClassDecorator;
+export type Audit = ReactiveElement;
+export declare class AuditController<T extends Audit> implements ReactiveController {
+    #private;
+    private host;
+    private options;
+    constructor(host: T, options: AuditOptions);
+    hostConnected(): Promise<void>;
+    hostDisconnected(): void;
+}

package/dist/internal/controllers/audit.controller.js

@@ -0,0 +1,74 @@
+import { GlobalStateService as e } from "../services/global.service.js";
+import { auditParentElement as t, auditSlots as n } from "../utils/audit.js";
+//#region src/internal/controllers/audit.controller.ts
+var r = 50;
+async function i(e) {
+	let { LogService: t } = await import("../services/log.service.js");
+	t.warn(e);
+}
+function a(e = {}) {
+	return (t) => t.addInitializer((t) => new o(t, e));
+}
+var o = class {
+	get #e() {
+		return e.state.audit[this.host.localName] ?? { count: 0 };
+	}
+	get #t() {
+		return e.state.env === "production";
+	}
+	get #n() {
+		return this.host.constructor.metadata;
+	}
+	constructor(e, t) {
+		this.host = e, this.options = t, this.#t || (this.host.addController(this), this.#r());
+	}
+	async hostConnected() {
+		await this.host.updateComplete, this.#t || (this.#i(), this.#s(), this.#c());
+	}
+	hostDisconnected() {
+		this.#a();
+	}
+	#r() {
+		e.state.audit[this.host.localName] || this.#o({ [this.host.localName]: { count: 0 } });
+	}
+	async #i() {
+		if (this.options.excessiveInstanceLimit !== void 0) if (this.#e.count > this.options.excessiveInstanceLimit && !this.#e.excessiveInstanceLimitAudited) {
+			let { getExcessiveInstanceLimitWarning: e } = await import("../utils/audit-logs.js");
+			i(e(this.#e.count, this.host.localName)), this.#o({ [this.host.localName]: {
+				count: this.#e.count + 1,
+				excessiveInstanceLimitAudited: !0
+			} });
+		} else this.#o({ [this.host.localName]: { count: this.#e.count + 1 } });
+	}
+	#a() {
+		this.options.excessiveInstanceLimit && this.#o({ [this.host.localName]: {
+			count: this.#e.count - 1,
+			excessiveInstanceLimitAudited: !1
+		} });
+	}
+	#o(t) {
+		e.dispatch("NVE_ELEMENTS_AUDIT_UPDATE", { audit: t });
+	}
+	async #s() {
+		if (this.#n.children || this.#n.disallowedChildren) {
+			let [e, t] = n(this.host);
+			if (e.length) {
+				let { getInvalidSlottedChildrenWarning: e } = await import("../utils/audit-logs.js");
+				i(e(this.host.localName, t));
+			}
+		}
+	}
+	async #c() {
+		if (this.#n.parents) {
+			let [e, n] = t(this.host);
+			if (!e) {
+				let { getInvalidParentWarning: e } = await import("../utils/audit-logs.js");
+				i(e(this.host.localName, n.join(", ")));
+			}
+		}
+	}
+};
+//#endregion
+export { o as AuditController, a as audit, r as excessiveInstanceLimit };
+
+//# sourceMappingURL=audit.controller.js.map

package/dist/internal/controllers/audit.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"audit.controller.js","names":["#hostAuditState","#production","#hostMetadata","#initializeAudit","#auditExcessiveInstanceLimit","#auditSlots","#auditParentElement","#cleanupExcessiveInstanceLimit","#update"],"sources":["../../../src/internal/controllers/audit.controller.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ReactiveController, ReactiveElement } from 'lit';\nimport type { LegacyDecoratorTarget } from '../types/index.js';\nimport { GlobalStateService } from '../services/global.service.js';\nimport { auditSlots, auditParentElement } from '../utils/audit.js';\n\nexport const excessiveInstanceLimit = 50;\n\nexport interface AuditOptions {\n  excessiveInstanceLimit?: number;\n  alternates?: { name: string; use: string }[];\n}\n\nexport interface AuditMetadata {\n  parents?: string[];\n  children?: string[];\n  disallowedChildren?: string[];\n}\n\ninterface AuditRegistry {\n  [key: string]: {\n    count?: number;\n    excessiveInstanceLimitAudited?: boolean;\n  };\n}\n\nasync function log(message: string) {\n  const { LogService } = await import('../services/log.service.js');\n  LogService.warn(message);\n}\n\nexport function audit<T extends Audit>(options: AuditOptions = {}): ClassDecorator {\n  return (target: LegacyDecoratorTarget) =>\n    target.addInitializer!((instance: T) => new AuditController(instance, options));\n}\n\nexport type Audit = ReactiveElement;\n\nexport class AuditController<T extends Audit> implements ReactiveController {\n  get #hostAuditState() {\n    return GlobalStateService.state.audit[this.host.localName] ?? { count: 0 };\n  }\n\n  get #production() {\n    return GlobalStateService.state.env === 'production';\n  }\n\n  get #hostMetadata() {\n    return (this.host.constructor as unknown as { metadata: AuditMetadata }).metadata;\n  }\n\n  constructor(\n    private host: T,\n    private options: AuditOptions\n  ) {\n    if (!this.#production) {\n      this.host.addController(this);\n      this.#initializeAudit();\n    }\n  }\n\n  async hostConnected() {\n    await this.host.updateComplete;\n    if (!this.#production) {\n      void this.#auditExcessiveInstanceLimit();\n      void this.#auditSlots();\n      void this.#auditParentElement();\n    }\n  }\n\n  hostDisconnected() {\n    this.#cleanupExcessiveInstanceLimit();\n  }\n\n  #initializeAudit() {\n    if (!GlobalStateService.state.audit[this.host.localName]) {\n      this.#update({ [this.host.localName]: { count: 0 } });\n    }\n  }\n\n  async #auditExcessiveInstanceLimit() {\n    if (this.options.excessiveInstanceLimit !== undefined) {\n      if (\n        this.#hostAuditState.count! > this.options.excessiveInstanceLimit &&\n        !this.#hostAuditState.excessiveInstanceLimitAudited\n      ) {\n        const { getExcessiveInstanceLimitWarning } = await import('../utils/audit-logs.js');\n        void log(getExcessiveInstanceLimitWarning(this.#hostAuditState.count!, this.host.localName));\n        this.#update({\n          [this.host.localName]: { count: this.#hostAuditState.count! + 1, excessiveInstanceLimitAudited: true }\n        });\n      } else {\n        this.#update({ [this.host.localName]: { count: this.#hostAuditState.count! + 1 } });\n      }\n    }\n  }\n\n  #cleanupExcessiveInstanceLimit() {\n    if (this.options.excessiveInstanceLimit) {\n      this.#update({\n        [this.host.localName]: { count: this.#hostAuditState.count! - 1, excessiveInstanceLimitAudited: false }\n      });\n    }\n  }\n\n  #update(audit: AuditRegistry) {\n    GlobalStateService.dispatch('NVE_ELEMENTS_AUDIT_UPDATE', { audit } as Partial<\n      typeof globalThis.NVE_ELEMENTS.state\n    >);\n  }\n\n  async #auditSlots() {\n    if (this.#hostMetadata.children || this.#hostMetadata.disallowedChildren) {\n      const [invalidElements, validElements] = auditSlots(this.host);\n      if (invalidElements.length) {\n        const { getInvalidSlottedChildrenWarning } = await import('../utils/audit-logs.js');\n        void log(getInvalidSlottedChildrenWarning(this.host.localName, validElements));\n      }\n    }\n  }\n\n  async #auditParentElement() {\n    if (this.#hostMetadata.parents) {\n      const [valid, validParents] = auditParentElement(this.host);\n      if (!valid) {\n        const { getInvalidParentWarning } = await import('../utils/audit-logs.js');\n        void log(getInvalidParentWarning(this.host.localName, validParents.join(', ')));\n      }\n    }\n  }\n}\n"],"mappings":";;;AAQA,IAAa,IAAyB;AAoBtC,eAAe,EAAI,GAAiB;CAClC,IAAM,EAAE,kBAAe,MAAM,OAAO;AACpC,GAAW,KAAK,EAAQ;;AAG1B,SAAgB,EAAuB,IAAwB,EAAE,EAAkB;AACjF,SAAQ,MACN,EAAO,gBAAiB,MAAgB,IAAI,EAAgB,GAAU,EAAQ,CAAC;;AAKnF,IAAa,IAAb,MAA4E;CAC1E,KAAA,IAAsB;AACpB,SAAO,EAAmB,MAAM,MAAM,KAAK,KAAK,cAAc,EAAE,OAAO,GAAG;;CAG5E,KAAA,IAAkB;AAChB,SAAO,EAAmB,MAAM,QAAQ;;CAG1C,KAAA,IAAoB;AAClB,SAAQ,KAAK,KAAK,YAAuD;;CAG3E,YACE,GACA,GACA;AACA,EAHQ,KAAA,OAAA,GACA,KAAA,UAAA,GAEH,MAAA,MACH,KAAK,KAAK,cAAc,KAAK,EAC7B,MAAA,GAAuB;;CAI3B,MAAM,gBAAgB;AAEpB,EADA,MAAM,KAAK,KAAK,gBACX,MAAA,MACE,MAAA,GAAmC,EACnC,MAAA,GAAkB,EAClB,MAAA,GAA0B;;CAInC,mBAAmB;AACjB,QAAA,GAAqC;;CAGvC,KAAmB;AACjB,EAAK,EAAmB,MAAM,MAAM,KAAK,KAAK,cAC5C,MAAA,EAAa,GAAG,KAAK,KAAK,YAAY,EAAE,OAAO,GAAG,EAAE,CAAC;;CAIzD,OAAA,IAAqC;AACnC,MAAI,KAAK,QAAQ,2BAA2B,KAAA,EAC1C,KACE,MAAA,EAAqB,QAAS,KAAK,QAAQ,0BAC3C,CAAC,MAAA,EAAqB,+BACtB;GACA,IAAM,EAAE,wCAAqC,MAAM,OAAO;AAE1D,GADK,EAAI,EAAiC,MAAA,EAAqB,OAAQ,KAAK,KAAK,UAAU,CAAC,EAC5F,MAAA,EAAa,GACV,KAAK,KAAK,YAAY;IAAE,OAAO,MAAA,EAAqB,QAAS;IAAG,+BAA+B;IAAM,EACvG,CAAC;QAEF,OAAA,EAAa,GAAG,KAAK,KAAK,YAAY,EAAE,OAAO,MAAA,EAAqB,QAAS,GAAG,EAAE,CAAC;;CAKzF,KAAiC;AAC/B,EAAI,KAAK,QAAQ,0BACf,MAAA,EAAa,GACV,KAAK,KAAK,YAAY;GAAE,OAAO,MAAA,EAAqB,QAAS;GAAG,+BAA+B;GAAO,EACxG,CAAC;;CAIN,GAAQ,GAAsB;AAC5B,IAAmB,SAAS,6BAA6B,EAAE,UAAO,CAEhE;;CAGJ,OAAA,IAAoB;AAClB,MAAI,MAAA,EAAmB,YAAY,MAAA,EAAmB,oBAAoB;GACxE,IAAM,CAAC,GAAiB,KAAiB,EAAW,KAAK,KAAK;AAC9D,OAAI,EAAgB,QAAQ;IAC1B,IAAM,EAAE,wCAAqC,MAAM,OAAO;AACrD,MAAI,EAAiC,KAAK,KAAK,WAAW,EAAc,CAAC;;;;CAKpF,OAAA,IAA4B;AAC1B,MAAI,MAAA,EAAmB,SAAS;GAC9B,IAAM,CAAC,GAAO,KAAgB,EAAmB,KAAK,KAAK;AAC3D,OAAI,CAAC,GAAO;IACV,IAAM,EAAE,+BAA4B,MAAM,OAAO;AAC5C,MAAI,EAAwB,KAAK,KAAK,WAAW,EAAa,KAAK,KAAK,CAAC,CAAC"}

package/dist/internal/controllers/i18n.controller.d.ts

@@ -0,0 +1,19 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+import { I18nStrings } from '../services/i18n.service.js';
+export declare function i18n<T extends I18n>(): ClassDecorator;
+export type I18n = ReactiveElement & {
+    i18n: Partial<I18nStrings> & {
+        __set?: boolean;
+    };
+};
+export declare class I18nController<T extends I18n> implements ReactiveController {
+    #private;
+    private host;
+    get i18n(): Partial<I18nStrings & {
+        __set: boolean;
+    }>;
+    constructor(host: T);
+    hostConnected(): void;
+    hostDisconnected(): void;
+    hostUpdated(): void;
+}

package/dist/internal/controllers/i18n.controller.examples.js

@@ -0,0 +1,6 @@
+//#region src/internal/controllers/i18n.controller.examples.ts
+var e = "";
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=i18n.controller.examples.js.map

package/dist/internal/controllers/i18n.controller.examples.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n.controller.examples.js","names":["#i18nController","#english","#french"],"sources":["../../../src/internal/controllers/i18n.controller.examples.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 { I18nController } from '@nvidia-elements/core/internal';\nimport { I18nService } from '@nvidia-elements/core';\nimport '@nvidia-elements/core/card/define.js';\nimport '@nvidia-elements/core/button/define.js';\n\nexport default {\n  title: 'Internal/Controllers'\n}\n\nclass I18nItem extends LitElement {\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  render() {\n    return html`<nve-card><pre style=\"padding: 24px\">${JSON.stringify(this.i18n, null, 2)}</pre></nve-card>`\n  }\n}\ncustomElements.get('i18n-item') || customElements.define('i18n-item', I18nItem);\n\nclass I18nDemo extends LitElement {\n  render() {\n    return html`\n    <div nve-layout=\"column gap:md\">\n      <div nve-layout=\"row gap:sm\">\n        <nve-button @click=${() => this.#english()}>English</nve-button>\n        <nve-button @click=${() => this.#french()}>French</nve-button>\n      </div>\n      \n      <div nve-layout=\"grid span-items:6 gap:sm\">\n        <i18n-item .i18n=${{ \"close\": \"dismiss task failure warning\" }}></i18n-item>\n        <i18n-item></i18n-item>\n      </div>\n    </div>\n    `\n  }\n\n  createRenderRoot() {\n    return this;\n  }\n\n  #french() {\n    I18nService.update({\n      close: 'fermer',\n      expand: 'étendre',\n      sort: 'classer',\n      show: 'montrer',\n      hide: 'cacher',\n      loading: 'bourrage'\n    });\n  }\n\n  #english() {\n    I18nService.update({\n      close: 'close',\n      expand: 'expand',\n      sort: 'sort',\n      show: 'show',\n      hide: 'hide',\n      loading: 'loading'\n    });\n  }\n}\ncustomElements.get('i18n-demo') || customElements.define('i18n-demo', I18nDemo);\n\n/**\n * @summary Internationalization controller with dynamic language switching between English and French.\n * @tags test-case\n */\nexport const I18nControllerDemo = {\n  render: () => html`<i18n-demo></i18n-demo>`\n}\n"],"mappings":";AAGA,IAAA,IAAe"}

package/dist/internal/controllers/i18n.controller.examples.json

@@ -0,0 +1,16 @@
+{
+  "entrypoint": "@nvidia-elements/core/internal/controllers/i18n.controller.examples.json",
+  "items": [
+    {
+      "id": "core-internal-controllers-i18n.controller_i18n-controller-demo",
+      "name": "I18nControllerDemo",
+      "template": "<i18n-demo></i18n-demo>\n",
+      "summary": "Internationalization controller with dynamic language switching between English and French.",
+      "description": "",
+      "composition": false,
+      "tags": [
+        "test-case"
+      ]
+    }
+  ]
+}

package/dist/internal/controllers/i18n.controller.js

@@ -0,0 +1,38 @@
+import { I18nService as e } from "../services/i18n.service.js";
+//#region src/internal/controllers/i18n.controller.ts
+function t() {
+	return (e) => e.addInitializer((e) => new n(e));
+}
+var n = class {
+	get i18n() {
+		return {
+			...e.i18n,
+			...this.host.i18n,
+			__set: !1
+		};
+	}
+	#e = {};
+	constructor(e) {
+		this.host = e, this.host.addController(this);
+	}
+	hostConnected() {
+		globalThis.document.addEventListener("NVE_ELEMENTS_I18N_UPDATE", this.#t);
+	}
+	hostDisconnected() {
+		globalThis.document.removeEventListener("NVE_ELEMENTS_I18N_UPDATE", this.#t);
+	}
+	hostUpdated() {
+		this.host.i18n.__set === void 0 && (this.#e = this.host.i18n, this.#t());
+	}
+	#t = () => {
+		this.host.i18n = {
+			...e.i18n,
+			...this.#e,
+			__set: !0
+		};
+	};
+};
+//#endregion
+export { n as I18nController, t as i18n };
+
+//# sourceMappingURL=i18n.controller.js.map

package/dist/internal/controllers/i18n.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n.controller.js","names":["#update","#overrides"],"sources":["../../../src/internal/controllers/i18n.controller.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ReactiveController, ReactiveElement } from 'lit';\nimport type { LegacyDecoratorTarget } from '../types/index.js';\nimport type { I18nStrings } from '../services/i18n.service.js';\nimport { I18nService } from '../services/i18n.service.js';\n\nexport function i18n<T extends I18n>(): ClassDecorator {\n  return (target: LegacyDecoratorTarget) => target.addInitializer!((instance: T) => new I18nController(instance));\n}\n\nexport type I18n = ReactiveElement & { i18n: Partial<I18nStrings> & { __set?: boolean } };\n\nexport class I18nController<T extends I18n> implements ReactiveController {\n  get i18n(): Partial<I18nStrings & { __set: boolean }> {\n    return { ...I18nService.i18n, ...this.host.i18n, __set: false };\n  }\n\n  #overrides: Partial<I18nStrings> = {};\n\n  constructor(private host: T) {\n    this.host.addController(this);\n  }\n\n  hostConnected() {\n    globalThis.document.addEventListener('NVE_ELEMENTS_I18N_UPDATE', this.#update);\n  }\n\n  hostDisconnected() {\n    globalThis.document.removeEventListener('NVE_ELEMENTS_I18N_UPDATE', this.#update);\n  }\n\n  hostUpdated() {\n    if (this.host.i18n.__set === undefined) {\n      // if the host lacks a set, an override exists\n      this.#overrides = this.host.i18n;\n      this.#update();\n    }\n  }\n\n  #update = () => {\n    this.host.i18n = { ...I18nService.i18n, ...this.#overrides, __set: true };\n  };\n}\n"],"mappings":";;AAQA,SAAgB,IAAuC;AACrD,SAAQ,MAAkC,EAAO,gBAAiB,MAAgB,IAAI,EAAe,EAAS,CAAC;;AAKjH,IAAa,IAAb,MAA0E;CACxE,IAAI,OAAkD;AACpD,SAAO;GAAE,GAAG,EAAY;GAAM,GAAG,KAAK,KAAK;GAAM,OAAO;GAAO;;CAGjE,KAAmC,EAAE;CAErC,YAAY,GAAiB;AAC3B,EADkB,KAAA,OAAA,GAClB,KAAK,KAAK,cAAc,KAAK;;CAG/B,gBAAgB;AACd,aAAW,SAAS,iBAAiB,4BAA4B,MAAA,EAAa;;CAGhF,mBAAmB;AACjB,aAAW,SAAS,oBAAoB,4BAA4B,MAAA,EAAa;;CAGnF,cAAc;AACZ,EAAI,KAAK,KAAK,KAAK,UAAU,KAAA,MAE3B,MAAA,IAAkB,KAAK,KAAK,MAC5B,MAAA,GAAc;;CAIlB,WAAgB;AACd,OAAK,KAAK,OAAO;GAAE,GAAG,EAAY;GAAM,GAAG,MAAA;GAAiB,OAAO;GAAM"}

package/dist/internal/controllers/keynav-grid.controller.d.ts

@@ -0,0 +1,31 @@
+import { ReactiveController, ReactiveElement } from 'lit';
+import { KeynavCode } from '../utils/dom.js';
+export interface KeynavGridConfig {
+    grid?: HTMLElement;
+    columnRow?: HTMLElement;
+    columns?: NodeListOf<HTMLElement> | HTMLElement[];
+    rows: NodeListOf<HTMLElement> | HTMLElement[];
+    cells: NodeListOf<HTMLElement> | HTMLElement[];
+}
+export interface KeynavGridElement {
+    keynavGridConfig: KeynavGridConfig;
+}
+/**
+ * https://w3c.github.io/aria-practices/#gridNav_focus
+ */
+export declare function keyNavigationGrid<T extends ReactiveElement & KeynavGridElement>(): ClassDecorator;
+export declare class KeyNavigationGridController<T extends ReactiveElement & KeynavGridElement> implements ReactiveController {
+    #private;
+    private host;
+    constructor(host: T);
+    hostConnected(): Promise<void>;
+    hostDisconnected(): void;
+}
+export declare function getNextKeyGridItem(cells: HTMLElement[], rows: HTMLElement[], config: {
+    code: KeynavCode | string;
+    ctrlKey: boolean;
+    dir: string;
+}): {
+    x: number;
+    y: number;
+};

package/dist/internal/controllers/keynav-grid.controller.examples.js

@@ -0,0 +1,6 @@
+//#region src/internal/controllers/keynav-grid.controller.examples.ts
+var e = "";
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=keynav-grid.controller.examples.js.map

package/dist/internal/controllers/keynav-grid.controller.examples.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"keynav-grid.controller.examples.js","names":[],"sources":["../../../src/internal/controllers/keynav-grid.controller.examples.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { css, html, LitElement } from 'lit';\nimport { state } from 'lit/decorators/state.js';\nimport { keyNavigationGrid } from '@nvidia-elements/core/internal';\n\nexport default {\n  title: 'Internal/Controllers'\n}\n\nconst styles = css`\n  section {\n    display: grid;\n    gap: 4px;\n    grid-template-columns: repeat(10, 50px);\n  }\n\n  .vertical {\n    grid-template-rows: repeat(10, 1fr);\n    grid-template-columns: 50px;\n  }\n\n  .row {\n    display: contents;\n  }\n\n  button {\n    width: 100%;\n    height: 30px;\n    min-width: 30px;\n    display: block;\n  }\n\n  button[selected] {\n    background: green;\n    color: white;\n  }\n`;\n\n@keyNavigationGrid<DemoKeyNavigationGridController>()\nclass DemoKeyNavigationGridController extends LitElement {\n  get keynavGridConfig() {\n    return {\n      rows: this.shadowRoot.querySelectorAll<HTMLElement>('.row'),\n      cells: this.shadowRoot.querySelectorAll<HTMLElement>('.cell')\n    }\n  }\n\n  @state() private selected = '0,0';\n  @state() private active = '';\n\n  static styles = [styles];\n\n  render() {\n    return html`\n      <p nve-text=\"body\">Selected: ${this.selected}</p>\n      <p nve-text=\"body\">Active: ${this.active}</p>\n      <section @nve-key-change=${e => (this.active = e.detail.activeItem.textContent)}>\n        ${Array.from(Array(10).keys()).map(() => Array.from(Array(10).keys())).map((r, ri) => html`<div class=\"row\">\n          ${r.map(c => html`<div class=\"cell\">\n            <button ?selected=${this.selected === `${ri}-${c}`} @click=${e => (this.selected = e.target.innerText)}>${ri}-${c}</button>\n          </div>`)}\n        </div>`)}\n      </section>\n    `;\n  }\n}\n\ncustomElements.get('demo-key-navigation-grid') || customElements.define('demo-key-navigation-grid', DemoKeyNavigationGridController);\n\n/**\n * @summary Grid-based keyboard navigation controller with arrow key support across rows and columns.\n * @tags test-case\n */\nexport const GridDemo = {\n  render: () => html`<demo-key-navigation-grid></demo-key-navigation-grid>`\n};\n"],"mappings":";AAGA,IAAA,IAAc"}

package/dist/internal/controllers/keynav-grid.controller.examples.json

@@ -0,0 +1,25 @@
+{
+  "entrypoint": "@nvidia-elements/core/internal/controllers/keynav-grid.controller.examples.json",
+  "items": [
+    {
+      "id": "core-internal-controllers-keynav-grid.controller_styles",
+      "name": "styles",
+      "template": "section { display: grid; gap: 4px; grid-template-columns: repeat(10, 50px); } .vertical { grid-template-rows: repeat(10,\n1fr); grid-template-columns: 50px; } .row { display: contents; } button { width: 100%; height: 30px; min-width: 30px;\ndisplay: block; } button[selected] { background: green; color: white; }\n",
+      "summary": "",
+      "description": "",
+      "composition": false,
+      "tags": []
+    },
+    {
+      "id": "core-internal-controllers-keynav-grid.controller_grid-demo",
+      "name": "GridDemo",
+      "template": "<demo-key-navigation-grid></demo-key-navigation-grid>\n",
+      "summary": "Grid-based keyboard navigation controller with arrow key support across rows and columns.",
+      "description": "",
+      "composition": false,
+      "tags": [
+        "test-case"
+      ]
+    }
+  ]
+}