@nvidia-elements/core 2.8.1 → 2.10.0

package/dist/internal/controllers/key-state.controller.d.ts

@@ -0,0 +1,18 @@
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
+export interface KeyStateControllerOptions {
+    readonly watchedCodes: ReadonlyArray<string>;
+}
+type KeyStateHost = ReactiveControllerHost & Pick<HTMLElement, 'ownerDocument'>;
+/** Provides host-scoped access to shared raw keyboard state without assigning interaction semantics to any key. */
+export declare class KeyStateController implements ReactiveController {
+    #private;
+    constructor(host: KeyStateHost, { watchedCodes }: KeyStateControllerOptions);
+    /** Enables shared keyboard tracking during the host's connected lifecycle. */
+    get enabled(): boolean;
+    set enabled(value: boolean);
+    /** Returns whether a key identified by `KeyboardEvent.code` is currently held. */
+    isPressed(code: string): boolean;
+    hostConnected(): void;
+    hostDisconnected(): void;
+}
+export {};

package/dist/internal/controllers/key-state.controller.js

@@ -0,0 +1,84 @@
+//#region src/internal/controllers/key-state.controller.ts
+var e = class {
+	#e;
+	#t = /* @__PURE__ */ new Set();
+	#n = /* @__PURE__ */ new Set();
+	constructor(e) {
+		this.#e = e;
+	}
+	subscribe(e) {
+		this.#n.has(e) || (this.#n.size === 0 && this.#r(), this.#n.add(e));
+	}
+	unsubscribe(e) {
+		!this.#n.delete(e) || this.#n.size > 0 || (this.#i(), this.#t.clear());
+	}
+	isPressed(e) {
+		return this.#t.has(e);
+	}
+	#r() {
+		let e = this.#e.defaultView;
+		e?.addEventListener("keydown", this.#a, !0), e?.addEventListener("keyup", this.#o, !0), e?.addEventListener("blur", this.#c), this.#e.addEventListener("visibilitychange", this.#s);
+	}
+	#i() {
+		let e = this.#e.defaultView;
+		e?.removeEventListener("keydown", this.#a, !0), e?.removeEventListener("keyup", this.#o, !0), e?.removeEventListener("blur", this.#c), this.#e.removeEventListener("visibilitychange", this.#s);
+	}
+	#a = (e) => {
+		this.#t.has(e.code) || (this.#t.add(e.code), this.#l(e.code));
+	};
+	#o = (e) => {
+		this.#t.delete(e.code) && this.#l(e.code);
+	};
+	#s = () => {
+		this.#e.visibilityState === "hidden" && this.#c();
+	};
+	#c = () => {
+		if (this.#t.size === 0) return;
+		let e = [...this.#t];
+		this.#t.clear();
+		for (let t of this.#n) e.some((e) => t.watchedCodes.has(e)) && t.requestUpdate();
+	};
+	#l(e) {
+		for (let t of this.#n) t.watchedCodes.has(e) && t.requestUpdate();
+	}
+}, t = /* @__PURE__ */ new WeakMap();
+function n(n) {
+	let r = t.get(n);
+	return r || (r = new e(n), t.set(n, r)), r;
+}
+var r = class {
+	#e;
+	#t;
+	#n = !1;
+	#r = !1;
+	#i;
+	constructor(e, { watchedCodes: t }) {
+		this.#e = e, this.#t = {
+			watchedCodes: new Set(t),
+			requestUpdate: () => e.requestUpdate()
+		}, e.addController(this);
+	}
+	get enabled() {
+		return this.#r;
+	}
+	set enabled(e) {
+		e !== this.#r && (this.#r = e, this.#a());
+	}
+	isPressed(e) {
+		return this.#i?.isPressed(e) ?? !1;
+	}
+	hostConnected() {
+		this.#n = !0, this.#a();
+	}
+	hostDisconnected() {
+		this.#n = !1, this.#a();
+	}
+	#a() {
+		let e = this.#n && this.#r ? n(this.#e.ownerDocument) : void 0;
+		e !== this.#i && (this.#i?.unsubscribe(this.#t), this.#i = e, this.#i?.subscribe(this.#t));
+	}
+};
+//#endregion
+export { r as KeyStateController };
+
+//# sourceMappingURL=key-state.controller.js.map

package/dist/internal/controllers/key-state.controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"key-state.controller.js","names":[],"sources":["../../../src/internal/controllers/key-state.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, ReactiveControllerHost } from 'lit';\n\nexport interface KeyStateControllerOptions {\n  readonly watchedCodes: ReadonlyArray<string>;\n}\n\ntype KeyStateHost = ReactiveControllerHost & Pick<HTMLElement, 'ownerDocument'>;\n\ninterface KeyStateSubscriber {\n  readonly watchedCodes: ReadonlySet<string>;\n  readonly requestUpdate: () => void;\n}\n\n/** Owns the keyboard state and global listeners shared by active controllers in one document. */\nclass DocumentKeyStateSource {\n  readonly #document: Document;\n  readonly #pressedCodes = new Set<string>();\n  readonly #subscribers = new Set<KeyStateSubscriber>();\n\n  constructor(document: Document) {\n    this.#document = document;\n  }\n\n  subscribe(subscriber: KeyStateSubscriber): void {\n    if (this.#subscribers.has(subscriber)) return;\n    if (this.#subscribers.size === 0) this.#addListeners();\n    this.#subscribers.add(subscriber);\n  }\n\n  unsubscribe(subscriber: KeyStateSubscriber): void {\n    if (!this.#subscribers.delete(subscriber) || this.#subscribers.size > 0) return;\n    this.#removeListeners();\n    this.#pressedCodes.clear();\n  }\n\n  isPressed(code: string): boolean {\n    return this.#pressedCodes.has(code);\n  }\n\n  #addListeners(): void {\n    const view = this.#document.defaultView;\n    view?.addEventListener('keydown', this.#handleKeyDown, true);\n    view?.addEventListener('keyup', this.#handleKeyUp, true);\n    view?.addEventListener('blur', this.#clear);\n    this.#document.addEventListener('visibilitychange', this.#handleVisibilityChange);\n  }\n\n  #removeListeners(): void {\n    const view = this.#document.defaultView;\n    view?.removeEventListener('keydown', this.#handleKeyDown, true);\n    view?.removeEventListener('keyup', this.#handleKeyUp, true);\n    view?.removeEventListener('blur', this.#clear);\n    this.#document.removeEventListener('visibilitychange', this.#handleVisibilityChange);\n  }\n\n  #handleKeyDown = (event: KeyboardEvent): void => {\n    if (this.#pressedCodes.has(event.code)) return;\n    this.#pressedCodes.add(event.code);\n    this.#notifySubscribers(event.code);\n  };\n\n  #handleKeyUp = (event: KeyboardEvent): void => {\n    if (!this.#pressedCodes.delete(event.code)) return;\n    this.#notifySubscribers(event.code);\n  };\n\n  #handleVisibilityChange = (): void => {\n    if (this.#document.visibilityState === 'hidden') this.#clear();\n  };\n\n  #clear = (): void => {\n    if (this.#pressedCodes.size === 0) return;\n    const changedCodes = [...this.#pressedCodes];\n    this.#pressedCodes.clear();\n    for (const subscriber of this.#subscribers) {\n      if (changedCodes.some(code => subscriber.watchedCodes.has(code))) subscriber.requestUpdate();\n    }\n  };\n\n  #notifySubscribers(code: string): void {\n    for (const subscriber of this.#subscribers) {\n      if (subscriber.watchedCodes.has(code)) subscriber.requestUpdate();\n    }\n  }\n}\n\nconst documentKeyStateSources = new WeakMap<Document, DocumentKeyStateSource>();\n\nfunction keyStateSourceFor(document: Document): DocumentKeyStateSource {\n  let source = documentKeyStateSources.get(document);\n  if (!source) {\n    source = new DocumentKeyStateSource(document);\n    documentKeyStateSources.set(document, source);\n  }\n  return source;\n}\n\n/** Provides host-scoped access to shared raw keyboard state without assigning interaction semantics to any key. */\nexport class KeyStateController implements ReactiveController {\n  readonly #host: KeyStateHost;\n  readonly #subscriber: KeyStateSubscriber;\n  #connected = false;\n  #enabled = false;\n  #source?: DocumentKeyStateSource;\n\n  constructor(host: KeyStateHost, { watchedCodes }: KeyStateControllerOptions) {\n    this.#host = host;\n    this.#subscriber = {\n      watchedCodes: new Set(watchedCodes),\n      requestUpdate: () => host.requestUpdate()\n    };\n    host.addController(this);\n  }\n\n  /** Enables shared keyboard tracking during the host's connected lifecycle. */\n  get enabled(): boolean {\n    return this.#enabled;\n  }\n\n  set enabled(value: boolean) {\n    if (value === this.#enabled) return;\n    this.#enabled = value;\n    this.#syncSubscription();\n  }\n\n  /** Returns whether a key identified by `KeyboardEvent.code` is currently held. */\n  isPressed(code: string): boolean {\n    return this.#source?.isPressed(code) ?? false;\n  }\n\n  hostConnected(): void {\n    this.#connected = true;\n    this.#syncSubscription();\n  }\n\n  hostDisconnected(): void {\n    this.#connected = false;\n    this.#syncSubscription();\n  }\n\n  #syncSubscription(): void {\n    const source = this.#connected && this.#enabled ? keyStateSourceFor(this.#host.ownerDocument) : undefined;\n    if (source === this.#source) return;\n    this.#source?.unsubscribe(this.#subscriber);\n    this.#source = source;\n    this.#source?.subscribe(this.#subscriber);\n  }\n}\n"],"mappings":";AAiBA,IAAM,IAAN,MAA6B;CAC3B;CACA,qBAAyB,IAAI,IAAY;CACzC,qBAAwB,IAAI,IAAwB;CAEpD,YAAY,GAAoB;EAC9B,KAAK,KAAY;CACnB;CAEA,UAAU,GAAsC;EAC1C,KAAK,GAAa,IAAI,CAAU,MAChC,KAAK,GAAa,SAAS,KAAG,KAAK,GAAc,GACrD,KAAK,GAAa,IAAI,CAAU;CAClC;CAEA,YAAY,GAAsC;EAC5C,CAAC,KAAK,GAAa,OAAO,CAAU,KAAK,KAAK,GAAa,OAAO,MACtE,KAAK,GAAiB,GACtB,KAAK,GAAc,MAAM;CAC3B;CAEA,UAAU,GAAuB;EAC/B,OAAO,KAAK,GAAc,IAAI,CAAI;CACpC;CAEA,KAAsB;EACpB,IAAM,IAAO,KAAK,GAAU;EAI5B,AAHA,GAAM,iBAAiB,WAAW,KAAK,IAAgB,EAAI,GAC3D,GAAM,iBAAiB,SAAS,KAAK,IAAc,EAAI,GACvD,GAAM,iBAAiB,QAAQ,KAAK,EAAM,GAC1C,KAAK,GAAU,iBAAiB,oBAAoB,KAAK,EAAuB;CAClF;CAEA,KAAyB;EACvB,IAAM,IAAO,KAAK,GAAU;EAI5B,AAHA,GAAM,oBAAoB,WAAW,KAAK,IAAgB,EAAI,GAC9D,GAAM,oBAAoB,SAAS,KAAK,IAAc,EAAI,GAC1D,GAAM,oBAAoB,QAAQ,KAAK,EAAM,GAC7C,KAAK,GAAU,oBAAoB,oBAAoB,KAAK,EAAuB;CACrF;CAEA,MAAkB,MAA+B;EAC3C,KAAK,GAAc,IAAI,EAAM,IAAI,MACrC,KAAK,GAAc,IAAI,EAAM,IAAI,GACjC,KAAK,GAAmB,EAAM,IAAI;CACpC;CAEA,MAAgB,MAA+B;EACxC,KAAK,GAAc,OAAO,EAAM,IAAI,KACzC,KAAK,GAAmB,EAAM,IAAI;CACpC;CAEA,WAAsC;EACpC,AAAI,KAAK,GAAU,oBAAoB,YAAU,KAAK,GAAO;CAC/D;CAEA,WAAqB;EACnB,IAAI,KAAK,GAAc,SAAS,GAAG;EACnC,IAAM,IAAe,CAAC,GAAG,KAAK,EAAa;EAC3C,KAAK,GAAc,MAAM;EACzB,KAAK,IAAM,KAAc,KAAK,IAC5B,AAAI,EAAa,MAAK,MAAQ,EAAW,aAAa,IAAI,CAAI,CAAC,KAAG,EAAW,cAAc;CAE/F;CAEA,GAAmB,GAAoB;EACrC,KAAK,IAAM,KAAc,KAAK,IAC5B,AAAI,EAAW,aAAa,IAAI,CAAI,KAAG,EAAW,cAAc;CAEpE;AACF,GAEM,oBAA0B,IAAI,QAA0C;AAE9E,SAAS,EAAkB,GAA4C;CACrE,IAAI,IAAS,EAAwB,IAAI,CAAQ;CAKjD,OAJK,MACH,IAAS,IAAI,EAAuB,CAAQ,GAC5C,EAAwB,IAAI,GAAU,CAAM,IAEvC;AACT;AAGA,IAAa,IAAb,MAA8D;CAC5D;CACA;CACA,KAAa;CACb,KAAW;CACX;CAEA,YAAY,GAAoB,EAAE,mBAA2C;EAM3E,AALA,KAAK,KAAQ,GACb,KAAK,KAAc;GACjB,cAAc,IAAI,IAAI,CAAY;GAClC,qBAAqB,EAAK,cAAc;EAC1C,GACA,EAAK,cAAc,IAAI;CACzB;CAGA,IAAI,UAAmB;EACrB,OAAO,KAAK;CACd;CAEA,IAAI,QAAQ,GAAgB;EACtB,MAAU,KAAK,OACnB,KAAK,KAAW,GAChB,KAAK,GAAkB;CACzB;CAGA,UAAU,GAAuB;EAC/B,OAAO,KAAK,IAAS,UAAU,CAAI,KAAK;CAC1C;CAEA,gBAAsB;EAEpB,AADA,KAAK,KAAa,IAClB,KAAK,GAAkB;CACzB;CAEA,mBAAyB;EAEvB,AADA,KAAK,KAAa,IAClB,KAAK,GAAkB;CACzB;CAEA,KAA0B;EACxB,IAAM,IAAS,KAAK,MAAc,KAAK,KAAW,EAAkB,KAAK,GAAM,aAAa,IAAI,KAAA;EAC5F,MAAW,KAAK,OACpB,KAAK,IAAS,YAAY,KAAK,EAAW,GAC1C,KAAK,KAAU,GACf,KAAK,IAAS,UAAU,KAAK,EAAW;CAC1C;AACF"}

package/dist/internal/controllers/keynav-list.controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"keynav-list.controller.js","names":[],"sources":["../../../src/internal/controllers/keynav-list.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 { focusElement, initializeKeyListItems, isFocusable, setActiveKeyListItem } from '../utils/focus.js';\nimport { KeynavCode, validKeyNavigationCode } from '../utils/dom.js';\n\nexport interface KeynavListConfig {\n  items: NodeListOf<HTMLElement> | HTMLElement[];\n  initialItem?: HTMLElement;\n  layout?: 'both' | 'horizontal' | 'vertical';\n  manageFocus?: boolean;\n  manageTabindex?: boolean;\n  loop?: boolean;\n  dir?: string | null;\n}\n\nexport interface KeynavListElement {\n  keynavListConfig: KeynavListConfig;\n}\n\n/** https://webaim.org/techniques/keyboard/ */\nexport function keyNavigationList<T extends ReactiveElement & KeynavListElement>(): ClassDecorator {\n  return (target: LegacyDecoratorTarget) =>\n    target.addInitializer!((instance: T) => new KeyNavigationListController(instance));\n}\n\nexport class KeyNavigationListController<T extends ReactiveElement & KeynavListElement> implements ReactiveController {\n  get #config(): KeynavListConfig & { items: HTMLElement[] } {\n    return {\n      layout: 'horizontal',\n      manageFocus: true,\n      manageTabindex: true,\n      loop: false,\n      dir: this.host.getAttribute('rtl'),\n      ...this.host.keynavListConfig,\n      items: Array.from(this.host.keynavListConfig.items).filter(\n        (i: HTMLElement & { disabled?: boolean }) => !i.disabled\n      )\n    };\n  }\n\n  constructor(private host: T) {\n    this.host.addController(this);\n  }\n\n  /** @private attr nve-keynav-disabled is an internal API for advanced use cases only */\n  get #keynavDisabled() {\n    return this.host.hasAttribute('nve-keynav-disabled');\n  }\n\n  async hostConnected() {\n    await this.host.updateComplete;\n    if (!this.host.isConnected) return;\n    this.#initializeTabIndex();\n    this.host.addEventListener('pointerup', this.#onPointerUp);\n    this.host.addEventListener('keydown', this.#onKeyDown);\n  }\n\n  hostDisconnected() {\n    this.host.removeEventListener('pointerup', this.#onPointerUp);\n    this.host.removeEventListener('keydown', this.#onKeyDown);\n  }\n\n  #initializeTabIndex() {\n    const { manageFocus, manageTabindex, items, initialItem } = this.#config;\n    if (manageFocus && manageTabindex && !this.#keynavDisabled) {\n      initializeKeyListItems(items);\n      if (initialItem && items.includes(initialItem)) {\n        setActiveKeyListItem(items, initialItem);\n      }\n    }\n  }\n\n  #clickItem(e: PointerEvent) {\n    const item = this.#getPointerActiveItem(e, this.#config.items);\n    if (item) {\n      this.#setActiveItem(e, item);\n    }\n  }\n\n  #focusItem(e: KeyboardEvent) {\n    if (validKeyNavigationCode(e) && !this.#keynavDisabled) {\n      const { loop, layout, dir, items } = this.#config;\n      const activeItem = this.#getKeyboardActiveItem(e, items);\n      if (activeItem) {\n        const { next, previous } = getNextKeyListItem(activeItem, Array.from(items), {\n          loop,\n          layout,\n          dir,\n          code: e.code as KeynavCode\n        });\n\n        if (next !== previous) {\n          this.#setActiveItem(e, items[next]!, items[previous]);\n        }\n      }\n    }\n  }\n\n  #getKeyboardActiveItem(e: KeyboardEvent, items: HTMLElement[]) {\n    const target = e.composedPath()[0];\n    return target instanceof HTMLElement && items.includes(target) ? target : null;\n  }\n\n  #getPointerActiveItem(e: PointerEvent, items: HTMLElement[]) {\n    const path = e.composedPath();\n    const itemIndex = path.findIndex(item => item instanceof HTMLElement && items.includes(item));\n    const item = path[itemIndex];\n\n    if (!(item instanceof HTMLElement)) return null;\n\n    const hasFocusableDescendant = path\n      .slice(0, itemIndex)\n      .some(descendant => descendant instanceof Element && isFocusable(descendant));\n    return hasFocusableDescendant ? null : item;\n  }\n\n  #setActiveItem(e: KeyboardEvent | PointerEvent, activeItem: HTMLElement, previousItem?: HTMLElement) {\n    const { manageFocus, manageTabindex, items } = this.#config;\n    if (manageFocus) {\n      if (manageTabindex) {\n        setActiveKeyListItem(items, activeItem);\n      }\n\n      focusElement(activeItem);\n      e.preventDefault();\n    }\n\n    const detail = {\n      activeItem,\n      previousItem,\n      code: e instanceof KeyboardEvent ? e.code : null,\n      metaKey: e.ctrlKey || e.metaKey,\n      items\n    };\n    activeItem.dispatchEvent(new CustomEvent('nve-key-change', { bubbles: true, composed: true, detail }));\n  }\n\n  #onPointerUp = (e: PointerEvent) => this.#clickItem(e);\n\n  #onKeyDown = (e: KeyboardEvent) => this.#focusItem(e);\n}\n\ninterface KeyListConfig {\n  code: KeynavCode;\n  loop?: boolean;\n  layout?: 'horizontal' | 'vertical' | 'both';\n  dir: string | null | undefined;\n}\n\nfunction resolveArrowDirection(config: KeyListConfig): 'backward' | 'forward' | null {\n  const { code, layout, dir } = config;\n  const start = dir === 'rtl' ? KeynavCode.ArrowRight : KeynavCode.ArrowLeft;\n  const end = dir === 'rtl' ? KeynavCode.ArrowLeft : KeynavCode.ArrowRight;\n\n  if (layout !== 'horizontal') {\n    if (code === KeynavCode.ArrowUp) return 'backward';\n    if (code === KeynavCode.ArrowDown) return 'forward';\n  }\n\n  if (layout !== 'vertical') {\n    if (code === start) return 'backward';\n    if (code === end) return 'forward';\n  }\n\n  return null;\n}\n\nfunction resolveSpecialKey(code: KeynavCode): 'home' | 'end' | 'pageup' | 'pagedown' | null {\n  if (code === KeynavCode.End) return 'end';\n  if (code === KeynavCode.Home) return 'home';\n  if (code === KeynavCode.PageUp) return 'pageup';\n  if (code === KeynavCode.PageDown) return 'pagedown';\n  return null;\n}\n\nfunction navigateWithLoop(current: number, step: number, options: { limit: number; loop: boolean | undefined }) {\n  const { limit, loop } = options;\n  const next = current + step;\n  if (next >= 0 && next <= limit) return next;\n  return loop ? (step < 0 ? limit : 0) : current;\n}\n\nexport function getNextKeyListItem(item: HTMLElement, items: HTMLElement[], config: KeyListConfig) {\n  let next = items.indexOf(item);\n  const previous = next;\n  const itemCount = items.length - 1;\n  const direction = resolveArrowDirection(config);\n\n  switch (direction ?? resolveSpecialKey(config.code)) {\n    case 'backward':\n      next = navigateWithLoop(next, -1, { limit: itemCount, loop: config.loop });\n      break;\n    case 'forward':\n      next = navigateWithLoop(next, 1, { limit: itemCount, loop: config.loop });\n      break;\n    case 'end':\n      next = itemCount;\n      break;\n    case 'home':\n      next = 0;\n      break;\n    case 'pageup':\n      next = Math.max(0, next - 4);\n      break;\n    case 'pagedown':\n      next = Math.min(itemCount, next + 4);\n      break;\n    case null:\n      break;\n  }\n\n  return { next, previous };\n}\n"],"mappings":"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"}
+{"version":3,"file":"keynav-list.controller.js","names":[],"sources":["../../../src/internal/controllers/keynav-list.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 { focusElement, initializeKeyListItems, isFocusable, setActiveKeyListItem } from '../utils/focus.js';\nimport { KeynavCode, validKeyNavigationCode } from '../utils/dom.js';\n\nexport interface KeynavListConfig {\n  items: NodeListOf<HTMLElement> | HTMLElement[];\n  initialItem?: HTMLElement;\n  layout?: 'both' | 'horizontal' | 'vertical';\n  manageFocus?: boolean;\n  manageTabindex?: boolean;\n  loop?: boolean;\n  dir?: string | null;\n}\n\nexport interface KeynavListElement {\n  keynavListConfig: KeynavListConfig;\n}\n\n/** https://webaim.org/techniques/keyboard/ */\nexport function keyNavigationList<T extends ReactiveElement & KeynavListElement>(): ClassDecorator {\n  return (target: LegacyDecoratorTarget) =>\n    target.addInitializer!((instance: T) => new KeyNavigationListController(instance));\n}\n\nexport class KeyNavigationListController<T extends ReactiveElement & KeynavListElement> implements ReactiveController {\n  get #config(): KeynavListConfig & { items: HTMLElement[] } {\n    return {\n      layout: 'horizontal',\n      manageFocus: true,\n      manageTabindex: true,\n      loop: false,\n      dir: this.host.getAttribute('rtl'),\n      ...this.host.keynavListConfig,\n      items: Array.from(this.host.keynavListConfig.items).filter(\n        (i: HTMLElement & { disabled?: boolean }) => !i.disabled\n      )\n    };\n  }\n\n  constructor(private host: T) {\n    this.host.addController(this);\n  }\n\n  /** @private attr nve-keynav-disabled is an internal API for advanced use cases only */\n  get #keynavDisabled() {\n    return this.host.hasAttribute('nve-keynav-disabled');\n  }\n\n  async hostConnected() {\n    await this.host.updateComplete;\n    if (!this.host.isConnected) return;\n    this.#initializeTabIndex();\n    this.host.addEventListener('pointerup', this.#onPointerUp);\n    this.host.addEventListener('keydown', this.#onKeyDown);\n  }\n\n  hostDisconnected() {\n    this.host.removeEventListener('pointerup', this.#onPointerUp);\n    this.host.removeEventListener('keydown', this.#onKeyDown);\n  }\n\n  #initializeTabIndex() {\n    const { manageFocus, manageTabindex, items, initialItem } = this.#config;\n    if (manageFocus && manageTabindex && !this.#keynavDisabled) {\n      initializeKeyListItems(items);\n      if (initialItem && items.includes(initialItem)) {\n        setActiveKeyListItem(items, initialItem);\n      }\n    }\n  }\n\n  #clickItem(e: PointerEvent) {\n    const item = this.#getPointerActiveItem(e, this.#config.items);\n    if (item) {\n      this.#setActiveItem(e, item);\n    }\n  }\n\n  #focusItem(e: KeyboardEvent) {\n    if (validKeyNavigationCode(e) && !this.#keynavDisabled) {\n      const { loop, layout, dir, items } = this.#config;\n      const activeItem = this.#getKeyboardActiveItem(e, items);\n      if (activeItem) {\n        const { next, previous } = getNextKeyListItem(activeItem, Array.from(items), {\n          loop,\n          layout,\n          dir,\n          code: e.code\n        });\n\n        if (next !== previous) {\n          this.#setActiveItem(e, items[next]!, items[previous]);\n        }\n      }\n    }\n  }\n\n  #getKeyboardActiveItem(e: KeyboardEvent, items: HTMLElement[]) {\n    const target = e.composedPath()[0];\n    return target instanceof HTMLElement && items.includes(target) ? target : null;\n  }\n\n  #getPointerActiveItem(e: PointerEvent, items: HTMLElement[]) {\n    const path = e.composedPath();\n    const itemIndex = path.findIndex(item => item instanceof HTMLElement && items.includes(item));\n    const item = path[itemIndex];\n\n    if (!(item instanceof HTMLElement)) return null;\n\n    const hasFocusableDescendant = path\n      .slice(0, itemIndex)\n      .some(descendant => descendant instanceof Element && isFocusable(descendant));\n    return hasFocusableDescendant ? null : item;\n  }\n\n  #setActiveItem(e: KeyboardEvent | PointerEvent, activeItem: HTMLElement, previousItem?: HTMLElement) {\n    const { manageFocus, manageTabindex, items } = this.#config;\n    if (manageFocus) {\n      if (manageTabindex) {\n        setActiveKeyListItem(items, activeItem);\n      }\n\n      focusElement(activeItem);\n      e.preventDefault();\n    }\n\n    const detail = {\n      activeItem,\n      previousItem,\n      code: e instanceof KeyboardEvent ? e.code : null,\n      metaKey: e.ctrlKey || e.metaKey,\n      items\n    };\n    activeItem.dispatchEvent(new CustomEvent('nve-key-change', { bubbles: true, composed: true, detail }));\n  }\n\n  #onPointerUp = (e: PointerEvent) => this.#clickItem(e);\n\n  #onKeyDown = (e: KeyboardEvent) => this.#focusItem(e);\n}\n\ninterface KeyListConfig {\n  code: KeynavCode;\n  loop?: boolean;\n  layout?: 'horizontal' | 'vertical' | 'both';\n  dir: string | null | undefined;\n}\n\nfunction resolveArrowDirection(config: KeyListConfig): 'backward' | 'forward' | null {\n  const { code, layout, dir } = config;\n  const start = dir === 'rtl' ? KeynavCode.ArrowRight : KeynavCode.ArrowLeft;\n  const end = dir === 'rtl' ? KeynavCode.ArrowLeft : KeynavCode.ArrowRight;\n\n  if (layout !== 'horizontal') {\n    if (code === KeynavCode.ArrowUp) return 'backward';\n    if (code === KeynavCode.ArrowDown) return 'forward';\n  }\n\n  if (layout !== 'vertical') {\n    if (code === start) return 'backward';\n    if (code === end) return 'forward';\n  }\n\n  return null;\n}\n\nfunction resolveSpecialKey(code: KeynavCode): 'home' | 'end' | 'pageup' | 'pagedown' | null {\n  if (code === KeynavCode.End) return 'end';\n  if (code === KeynavCode.Home) return 'home';\n  if (code === KeynavCode.PageUp) return 'pageup';\n  if (code === KeynavCode.PageDown) return 'pagedown';\n  return null;\n}\n\nfunction navigateWithLoop(current: number, step: number, options: { limit: number; loop: boolean | undefined }) {\n  const { limit, loop } = options;\n  const next = current + step;\n  if (next >= 0 && next <= limit) return next;\n  return loop ? (step < 0 ? limit : 0) : current;\n}\n\nexport function getNextKeyListItem(item: HTMLElement, items: HTMLElement[], config: KeyListConfig) {\n  let next = items.indexOf(item);\n  const previous = next;\n  const itemCount = items.length - 1;\n  const direction = resolveArrowDirection(config);\n\n  switch (direction ?? resolveSpecialKey(config.code)) {\n    case 'backward':\n      next = navigateWithLoop(next, -1, { limit: itemCount, loop: config.loop });\n      break;\n    case 'forward':\n      next = navigateWithLoop(next, 1, { limit: itemCount, loop: config.loop });\n      break;\n    case 'end':\n      next = itemCount;\n      break;\n    case 'home':\n      next = 0;\n      break;\n    case 'pageup':\n      next = Math.max(0, next - 4);\n      break;\n    case 'pagedown':\n      next = Math.min(itemCount, next + 4);\n      break;\n    case null:\n      break;\n  }\n\n  return { next, previous };\n}\n"],"mappings":";;;AAuBA,SAAgB,IAAmF;CACjG,QAAQ,MACN,EAAO,gBAAiB,MAAgB,IAAI,EAA4B,CAAQ,CAAC;AACrF;AAEA,IAAa,IAAb,MAAsH;CACpH,IAAI,KAAuD;EACzD,OAAO;GACL,QAAQ;GACR,aAAa;GACb,gBAAgB;GAChB,MAAM;GACN,KAAK,KAAK,KAAK,aAAa,KAAK;GACjC,GAAG,KAAK,KAAK;GACb,OAAO,MAAM,KAAK,KAAK,KAAK,iBAAiB,KAAK,CAAC,CAAC,QACjD,MAA4C,CAAC,EAAE,QAClD;EACF;CACF;CAEA,YAAY,GAAiB;EAC3B,AADkB,KAAA,OAAA,GAClB,KAAK,KAAK,cAAc,IAAI;CAC9B;CAGA,IAAI,KAAkB;EACpB,OAAO,KAAK,KAAK,aAAa,qBAAqB;CACrD;CAEA,MAAM,gBAAgB;EACpB,MAAM,KAAK,KAAK,gBACX,KAAK,KAAK,gBACf,KAAK,GAAoB,GACzB,KAAK,KAAK,iBAAiB,aAAa,KAAK,EAAY,GACzD,KAAK,KAAK,iBAAiB,WAAW,KAAK,EAAU;CACvD;CAEA,mBAAmB;EAEjB,AADA,KAAK,KAAK,oBAAoB,aAAa,KAAK,EAAY,GAC5D,KAAK,KAAK,oBAAoB,WAAW,KAAK,EAAU;CAC1D;CAEA,KAAsB;EACpB,IAAM,EAAE,gBAAa,mBAAgB,UAAO,mBAAgB,KAAK;EACjE,AAAI,KAAe,KAAkB,CAAC,KAAK,OACzC,EAAuB,CAAK,GACxB,KAAe,EAAM,SAAS,CAAW,KAC3C,EAAqB,GAAO,CAAW;CAG7C;CAEA,GAAW,GAAiB;EAC1B,IAAM,IAAO,KAAK,GAAsB,GAAG,KAAK,GAAQ,KAAK;EAC7D,AAAI,KACF,KAAK,GAAe,GAAG,CAAI;CAE/B;CAEA,GAAW,GAAkB;EAC3B,IAAI,EAAuB,CAAC,KAAK,CAAC,KAAK,IAAiB;GACtD,IAAM,EAAE,SAAM,WAAQ,QAAK,aAAU,KAAK,IACpC,IAAa,KAAK,GAAuB,GAAG,CAAK;GACvD,IAAI,GAAY;IACd,IAAM,EAAE,SAAM,gBAAa,EAAmB,GAAY,MAAM,KAAK,CAAK,GAAG;KAC3E;KACA;KACA;KACA,MAAM,EAAE;IACV,CAAC;IAED,AAAI,MAAS,KACX,KAAK,GAAe,GAAG,EAAM,IAAQ,EAAM,EAAS;GAExD;EACF;CACF;CAEA,GAAuB,GAAkB,GAAsB;EAC7D,IAAM,IAAS,EAAE,aAAa,CAAC,CAAC;EAChC,OAAO,aAAkB,eAAe,EAAM,SAAS,CAAM,IAAI,IAAS;CAC5E;CAEA,GAAsB,GAAiB,GAAsB;EAC3D,IAAM,IAAO,EAAE,aAAa,GACtB,IAAY,EAAK,WAAU,MAAQ,aAAgB,eAAe,EAAM,SAAS,CAAI,CAAC,GACtF,IAAO,EAAK;EAOlB,OALM,aAAgB,cAES,EAC5B,MAAM,GAAG,CAAS,CAAC,CACnB,MAAK,MAAc,aAAsB,WAAW,EAAY,CAAU,CACtE,IAAyB,OAAO,IALI;CAM7C;CAEA,GAAe,GAAiC,GAAyB,GAA4B;EACnG,IAAM,EAAE,gBAAa,mBAAgB,aAAU,KAAK;EACpD,AAAI,MACE,KACF,EAAqB,GAAO,CAAU,GAGxC,EAAa,CAAU,GACvB,EAAE,eAAe;EAGnB,IAAM,IAAS;GACb;GACA;GACA,MAAM,aAAa,gBAAgB,EAAE,OAAO;GAC5C,SAAS,EAAE,WAAW,EAAE;GACxB;EACF;EACA,EAAW,cAAc,IAAI,YAAY,kBAAkB;GAAE,SAAS;GAAM,UAAU;GAAM;EAAO,CAAC,CAAC;CACvG;CAEA,MAAgB,MAAoB,KAAK,GAAW,CAAC;CAErD,MAAc,MAAqB,KAAK,GAAW,CAAC;AACtD;AASA,SAAS,EAAsB,GAAsD;CACnF,IAAM,EAAE,SAAM,WAAQ,WAAQ,GACxB,IAAQ,MAAQ,QAAQ,EAAW,aAAa,EAAW,WAC3D,IAAM,MAAQ,QAAQ,EAAW,YAAY,EAAW;CAE9D,IAAI,MAAW,cAAc;EAC3B,IAAI,MAAS,EAAW,SAAS,OAAO;EACxC,IAAI,MAAS,EAAW,WAAW,OAAO;CAC5C;CAEA,IAAI,MAAW,YAAY;EACzB,IAAI,MAAS,GAAO,OAAO;EAC3B,IAAI,MAAS,GAAK,OAAO;CAC3B;CAEA,OAAO;AACT;AAEA,SAAS,EAAkB,GAAiE;CAK1F,OAJI,MAAS,EAAW,MAAY,QAChC,MAAS,EAAW,OAAa,SACjC,MAAS,EAAW,SAAe,WACnC,MAAS,EAAW,WAAiB,aAClC;AACT;AAEA,SAAS,EAAiB,GAAiB,GAAc,GAAuD;CAC9G,IAAM,EAAE,UAAO,YAAS,GAClB,IAAO,IAAU;CAEvB,OADI,KAAQ,KAAK,KAAQ,IAAc,IAChC,IAAQ,IAAO,IAAI,IAAQ,IAAK;AACzC;AAEA,SAAgB,EAAmB,GAAmB,GAAsB,GAAuB;CACjG,IAAI,IAAO,EAAM,QAAQ,CAAI,GACvB,IAAW,GACX,IAAY,EAAM,SAAS;CAGjC,QAFkB,EAAsB,CAEhC,KAAa,EAAkB,EAAO,IAAI,GAAlD;EACE,KAAK;GACH,IAAO,EAAiB,GAAM,IAAI;IAAE,OAAO;IAAW,MAAM,EAAO;GAAK,CAAC;GACzE;EACF,KAAK;GACH,IAAO,EAAiB,GAAM,GAAG;IAAE,OAAO;IAAW,MAAM,EAAO;GAAK,CAAC;GACxE;EACF,KAAK;GACH,IAAO;GACP;EACF,KAAK;GACH,IAAO;GACP;EACF,KAAK;GACH,IAAO,KAAK,IAAI,GAAG,IAAO,CAAC;GAC3B;EACF,KAAK,YACH,IAAO,KAAK,IAAI,GAAW,IAAO,CAAC;CAIvC;CAEA,OAAO;EAAE;EAAM;CAAS;AAC1B"}

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

@@ -1,6 +1,9 @@
 import type { ReactiveController, ReactiveControllerHost } from 'lit';
 type SpatialKeyHost = ReactiveControllerHost & HTMLElement;
 export type SpatialKeyHandling = 'handled' | 'ignored';
+export interface KeyNavigationSpatialControllerOptions {
+    readonly isEnabled?: () => boolean;
+}
 export type SpatialKeyCommand = {
     readonly ctrlKey: boolean;
     readonly event: KeyboardEvent;
@@ -17,7 +20,7 @@ export type SpatialKeyCommand = {
 /** Converts direct-host keyboard input into spatial direction and zoom commands. */
 export declare class KeyNavigationSpatialController implements ReactiveController {
     #private;
-    constructor(host: SpatialKeyHost);
+    constructor(host: SpatialKeyHost, { isEnabled }?: KeyNavigationSpatialControllerOptions);
     hostConnected(): void;
     hostDisconnected(): void;
 }

package/dist/internal/controllers/keynav-spatial.controller.js

@@ -1,17 +1,18 @@
 //#region src/internal/controllers/keynav-spatial.controller.ts
 var e = class {
 	#e;
-	constructor(e) {
-		this.#e = e, e.addController(this);
+	#t;
+	constructor(e, { isEnabled: t = () => !0 } = {}) {
+		this.#e = e, this.#t = t, e.addController(this);
 	}
 	hostConnected() {
-		this.#e.addEventListener("keydown", this.#t);
+		this.#e.addEventListener("keydown", this.#n);
 	}
 	hostDisconnected() {
-		this.#e.removeEventListener("keydown", this.#t);
+		this.#e.removeEventListener("keydown", this.#n);
 	}
-	#t = (e) => {
-		if (e.composedPath()[0] !== this.#e) return;
+	#n = (e) => {
+		if (!this.#t() || e.composedPath()[0] !== this.#e) return;
 		let n = t(e);
 		n && this.#e.dispatchEvent(new CustomEvent("nve-key", {
 			bubbles: !1,

package/dist/internal/controllers/keynav-spatial.controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"keynav-spatial.controller.js","names":[],"sources":["../../../src/internal/controllers/keynav-spatial.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, ReactiveControllerHost } from 'lit';\n\ntype SpatialKeyHost = ReactiveControllerHost & HTMLElement;\n\nexport type SpatialKeyHandling = 'handled' | 'ignored';\n\nexport type SpatialKeyCommand =\n  | {\n      readonly ctrlKey: boolean;\n      readonly event: KeyboardEvent;\n      readonly kind: 'direction';\n      readonly horizontal: -1 | 0 | 1;\n      readonly key: 'ArrowDown' | 'ArrowLeft' | 'ArrowRight' | 'ArrowUp';\n      readonly shiftKey: boolean;\n      readonly vertical: -1 | 0 | 1;\n    }\n  | {\n      readonly event: KeyboardEvent;\n      readonly kind: 'zoom';\n      readonly key: '+' | '-' | '=';\n    };\n\n/** Converts direct-host keyboard input into spatial direction and zoom commands. */\nexport class KeyNavigationSpatialController implements ReactiveController {\n  readonly #host: SpatialKeyHost;\n\n  constructor(host: SpatialKeyHost) {\n    this.#host = host;\n    host.addController(this);\n  }\n\n  hostConnected(): void {\n    this.#host.addEventListener('keydown', this.#handleKeydown);\n  }\n\n  hostDisconnected(): void {\n    this.#host.removeEventListener('keydown', this.#handleKeydown);\n  }\n\n  #handleKeydown = (event: KeyboardEvent): void => {\n    if (event.composedPath()[0] !== this.#host) return;\n    const command = getSpatialKeyCommand(event);\n    if (!command) return;\n    this.#host.dispatchEvent(\n      new CustomEvent<SpatialKeyCommand>('nve-key', {\n        bubbles: false,\n        cancelable: false,\n        composed: false,\n        detail: command\n      })\n    );\n  };\n}\n\nfunction getSpatialKeyCommand(event: KeyboardEvent): SpatialKeyCommand | undefined {\n  switch (event.key) {\n    case 'ArrowDown':\n      return {\n        ctrlKey: event.ctrlKey,\n        event,\n        horizontal: 0,\n        key: event.key,\n        kind: 'direction',\n        shiftKey: event.shiftKey,\n        vertical: -1\n      };\n    case 'ArrowLeft':\n      return {\n        ctrlKey: event.ctrlKey,\n        event,\n        horizontal: -1,\n        key: event.key,\n        kind: 'direction',\n        shiftKey: event.shiftKey,\n        vertical: 0\n      };\n    case 'ArrowRight':\n      return {\n        ctrlKey: event.ctrlKey,\n        event,\n        horizontal: 1,\n        key: event.key,\n        kind: 'direction',\n        shiftKey: event.shiftKey,\n        vertical: 0\n      };\n    case 'ArrowUp':\n      return {\n        ctrlKey: event.ctrlKey,\n        event,\n        horizontal: 0,\n        key: event.key,\n        kind: 'direction',\n        shiftKey: event.shiftKey,\n        vertical: 1\n      };\n    case '+':\n    case '-':\n    case '=':\n      return { event, key: event.key, kind: 'zoom' };\n    default:\n      return undefined;\n  }\n}\n"],"mappings":";AA0BA,IAAa,IAAb,MAA0E;CACxE;CAEA,YAAY,GAAsB;EAEhC,AADA,KAAK,KAAQ,GACb,EAAK,cAAc,IAAI;CACzB;CAEA,gBAAsB;EACpB,KAAK,GAAM,iBAAiB,WAAW,KAAK,EAAc;CAC5D;CAEA,mBAAyB;EACvB,KAAK,GAAM,oBAAoB,WAAW,KAAK,EAAc;CAC/D;CAEA,MAAkB,MAA+B;EAC/C,IAAI,EAAM,aAAa,CAAC,CAAC,OAAO,KAAK,IAAO;EAC5C,IAAM,IAAU,EAAqB,CAAK;EACrC,KACL,KAAK,GAAM,cACT,IAAI,YAA+B,WAAW;GAC5C,SAAS;GACT,YAAY;GACZ,UAAU;GACV,QAAQ;EACV,CAAC,CACH;CACF;AACF;AAEA,SAAS,EAAqB,GAAqD;CACjF,QAAQ,EAAM,KAAd;EACE,KAAK,aACH,OAAO;GACL,SAAS,EAAM;GACf;GACA,YAAY;GACZ,KAAK,EAAM;GACX,MAAM;GACN,UAAU,EAAM;GAChB,UAAU;EACZ;EACF,KAAK,aACH,OAAO;GACL,SAAS,EAAM;GACf;GACA,YAAY;GACZ,KAAK,EAAM;GACX,MAAM;GACN,UAAU,EAAM;GAChB,UAAU;EACZ;EACF,KAAK,cACH,OAAO;GACL,SAAS,EAAM;GACf;GACA,YAAY;GACZ,KAAK,EAAM;GACX,MAAM;GACN,UAAU,EAAM;GAChB,UAAU;EACZ;EACF,KAAK,WACH,OAAO;GACL,SAAS,EAAM;GACf;GACA,YAAY;GACZ,KAAK,EAAM;GACX,MAAM;GACN,UAAU,EAAM;GAChB,UAAU;EACZ;EACF,KAAK;EACL,KAAK;EACL,KAAK,KACH,OAAO;GAAE;GAAO,KAAK,EAAM;GAAK,MAAM;EAAO;EAC/C,SACE;CACJ;AACF"}
+{"version":3,"file":"keynav-spatial.controller.js","names":[],"sources":["../../../src/internal/controllers/keynav-spatial.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, ReactiveControllerHost } from 'lit';\n\ntype SpatialKeyHost = ReactiveControllerHost & HTMLElement;\n\nexport type SpatialKeyHandling = 'handled' | 'ignored';\n\nexport interface KeyNavigationSpatialControllerOptions {\n  readonly isEnabled?: () => boolean;\n}\n\nexport type SpatialKeyCommand =\n  | {\n      readonly ctrlKey: boolean;\n      readonly event: KeyboardEvent;\n      readonly kind: 'direction';\n      readonly horizontal: -1 | 0 | 1;\n      readonly key: 'ArrowDown' | 'ArrowLeft' | 'ArrowRight' | 'ArrowUp';\n      readonly shiftKey: boolean;\n      readonly vertical: -1 | 0 | 1;\n    }\n  | {\n      readonly event: KeyboardEvent;\n      readonly kind: 'zoom';\n      readonly key: '+' | '-' | '=';\n    };\n\n/** Converts direct-host keyboard input into spatial direction and zoom commands. */\nexport class KeyNavigationSpatialController implements ReactiveController {\n  readonly #host: SpatialKeyHost;\n  readonly #isEnabled: () => boolean;\n\n  constructor(host: SpatialKeyHost, { isEnabled = () => true }: KeyNavigationSpatialControllerOptions = {}) {\n    this.#host = host;\n    this.#isEnabled = isEnabled;\n    host.addController(this);\n  }\n\n  hostConnected(): void {\n    this.#host.addEventListener('keydown', this.#handleKeydown);\n  }\n\n  hostDisconnected(): void {\n    this.#host.removeEventListener('keydown', this.#handleKeydown);\n  }\n\n  #handleKeydown = (event: KeyboardEvent): void => {\n    if (!this.#isEnabled() || event.composedPath()[0] !== this.#host) return;\n    const command = getSpatialKeyCommand(event);\n    if (!command) return;\n    this.#host.dispatchEvent(\n      new CustomEvent<SpatialKeyCommand>('nve-key', {\n        bubbles: false,\n        cancelable: false,\n        composed: false,\n        detail: command\n      })\n    );\n  };\n}\n\nfunction getSpatialKeyCommand(event: KeyboardEvent): SpatialKeyCommand | undefined {\n  switch (event.key) {\n    case 'ArrowDown':\n      return {\n        ctrlKey: event.ctrlKey,\n        event,\n        horizontal: 0,\n        key: event.key,\n        kind: 'direction',\n        shiftKey: event.shiftKey,\n        vertical: -1\n      };\n    case 'ArrowLeft':\n      return {\n        ctrlKey: event.ctrlKey,\n        event,\n        horizontal: -1,\n        key: event.key,\n        kind: 'direction',\n        shiftKey: event.shiftKey,\n        vertical: 0\n      };\n    case 'ArrowRight':\n      return {\n        ctrlKey: event.ctrlKey,\n        event,\n        horizontal: 1,\n        key: event.key,\n        kind: 'direction',\n        shiftKey: event.shiftKey,\n        vertical: 0\n      };\n    case 'ArrowUp':\n      return {\n        ctrlKey: event.ctrlKey,\n        event,\n        horizontal: 0,\n        key: event.key,\n        kind: 'direction',\n        shiftKey: event.shiftKey,\n        vertical: 1\n      };\n    case '+':\n    case '-':\n    case '=':\n      return { event, key: event.key, kind: 'zoom' };\n    default:\n      return undefined;\n  }\n}\n"],"mappings":";AA8BA,IAAa,IAAb,MAA0E;CACxE;CACA;CAEA,YAAY,GAAsB,EAAE,qBAAkB,OAAgD,CAAC,GAAG;EAGxG,AAFA,KAAK,KAAQ,GACb,KAAK,KAAa,GAClB,EAAK,cAAc,IAAI;CACzB;CAEA,gBAAsB;EACpB,KAAK,GAAM,iBAAiB,WAAW,KAAK,EAAc;CAC5D;CAEA,mBAAyB;EACvB,KAAK,GAAM,oBAAoB,WAAW,KAAK,EAAc;CAC/D;CAEA,MAAkB,MAA+B;EAC/C,IAAI,CAAC,KAAK,GAAW,KAAK,EAAM,aAAa,CAAC,CAAC,OAAO,KAAK,IAAO;EAClE,IAAM,IAAU,EAAqB,CAAK;EACrC,KACL,KAAK,GAAM,cACT,IAAI,YAA+B,WAAW;GAC5C,SAAS;GACT,YAAY;GACZ,UAAU;GACV,QAAQ;EACV,CAAC,CACH;CACF;AACF;AAEA,SAAS,EAAqB,GAAqD;CACjF,QAAQ,EAAM,KAAd;EACE,KAAK,aACH,OAAO;GACL,SAAS,EAAM;GACf;GACA,YAAY;GACZ,KAAK,EAAM;GACX,MAAM;GACN,UAAU,EAAM;GAChB,UAAU;EACZ;EACF,KAAK,aACH,OAAO;GACL,SAAS,EAAM;GACf;GACA,YAAY;GACZ,KAAK,EAAM;GACX,MAAM;GACN,UAAU,EAAM;GAChB,UAAU;EACZ;EACF,KAAK,cACH,OAAO;GACL,SAAS,EAAM;GACf;GACA,YAAY;GACZ,KAAK,EAAM;GACX,MAAM;GACN,UAAU,EAAM;GAChB,UAAU;EACZ;EACF,KAAK,WACH,OAAO;GACL,SAAS,EAAM;GACf;GACA,YAAY;GACZ,KAAK,EAAM;GACX,MAAM;GACN,UAAU,EAAM;GAChB,UAAU;EACZ;EACF,KAAK;EACL,KAAK;EACL,KAAK,KACH,OAAO;GAAE;GAAO,KAAK,EAAM;GAAK,MAAM;EAAO;EAC/C,SACE;CACJ;AACF"}

package/dist/internal/index.d.ts

@@ -4,6 +4,7 @@
 export * from './controllers/audit.controller.js';
 export * from './controllers/gesture.controller.js';
 export * from './controllers/i18n.controller.js';
+export * from './controllers/key-state.controller.js';
 export * from './controllers/keynav-grid.controller.js';
 export * from './controllers/keynav-list.controller.js';
 export * from './controllers/keynav-spatial.controller.js';
@@ -34,4 +35,5 @@ export * from './utils/objects.js';
 export * from './utils/strings.js';
 export * from './utils/focus.js';
 export * from './utils/keynav.js';
+export * from './utils/numeric.js';
 export * from './utils/supports.js';

package/dist/internal/index.js

@@ -6,30 +6,32 @@ import { AuditController as p, audit as m, excessiveInstanceLimit as h } from ".
 import { GestureController as g } from "./controllers/gesture.controller.js";
 import { I18nService as _, I18nService_ as v } from "./services/i18n.service.js";
 import { I18nController as y, i18n as b } from "./controllers/i18n.controller.js";
-import { debounce as x, onChildListMutation as S, stopEvent as C, throttle as w } from "./utils/events.js";
-import { LogService as T } from "./services/log.service.js";
-import { focusElement as E, focusElementTimeout as D, getActiveElement as O, initializeKeyListItems as k, isFocusable as A, isSimpleFocusable as j, onListboxActivate as M, setActiveKeyListItem as N } from "./utils/focus.js";
-import { KeynavCode as P, appendAnchorName as F, appendRootNodeStyle as I, applySlotContentStates as L, clickOutsideElementBounds as R, createGhostElement as z, define as B, defineElement as V, endOfScrollBox as H, generateId as U, getAnchorNames as W, getAttributeChanges as G, getAttributeListChanges as K, getChildren as q, getDisplayValue as J, getElementUpdate as Y, getFlattenedDOMTree as X, getFlattenedFocusableItems as Z, getPropertyChanges as Q, getThemeTokens as $, hasHorizontalScrollBar as ee, hasInvalidDOMGrid as te, hasScrollBar as ne, isContextMenuClick as re, matchesElementName as ie, openEyeDropper as ae, parseTokenNumber as oe, removeAnchorName as se, removeEmptySlotWhitespace as ce, removeEmptyTextNode as le, sameOrderedStringArray as ue, sameRenderRoot as de, scrollBarWidth as fe, slotContainsOnlyWhitespace as pe, styleSheetToString as me, supportsScopedRegistry as he, uniqueNonEmptyStrings as ge, validKeyNavigationCode as _e } from "./utils/dom.js";
-import { KeyNavigationGridController as ve, getNextKeyGridItem as ye, keyNavigationGrid as be } from "./controllers/keynav-grid.controller.js";
-import { KeyNavigationListController as xe, getNextKeyListItem as Se, keyNavigationList as Ce } from "./controllers/keynav-list.controller.js";
-import { KeyNavigationSpatialController as we } from "./controllers/keynav-spatial.controller.js";
-import { associateAriaDescribedBy as Te, associateAriaLabel as Ee, associateControlGroup as De, associateDataList as Oe, associateLabel as ke, attachInternals as Ae } from "./utils/a11y.js";
-import { StateExpandedController as je, stateExpanded as Me } from "./controllers/state-expanded.controller.js";
-import { StateHighlightedController as Ne, stateHighlighted as Pe } from "./controllers/state-highlighted.controller.js";
-import { StateScrollController as Fe, stateScroll as Ie } from "./controllers/state-scroll.controller.js";
-import { StateSelectedController as Le, stateSelected as Re } from "./controllers/state-selected.controller.js";
-import { TypeAnchorController as ze, typeAnchor as Be } from "./controllers/type-anchor.controller.js";
-import { TypeClosableController as Ve } from "./controllers/type-closable.controller.js";
-import { TypeExpandableController as He } from "./controllers/type-expandable.controller.js";
-import { TypeSelectableController as Ue } from "./controllers/type-selectable.controller.js";
-import { TypeNativePopoverController as We } from "./controllers/type-native-popover.controller.js";
-import { TypeSSRController as Ge, typeSSR as Ke } from "./controllers/type-ssr.controller.js";
-import { hostAttr as qe } from "./decorators/host-attr.js";
-import { scopedRegistry as Je } from "./decorators/scoped-registry.js";
-import { colorStateStyles as Ye, statusStateStyles as Xe, supportStateStyles as Ze, useStyles as Qe } from "./styles/index.js";
-import { supportsCSSLegacyInsetArea as $e, supportsCSSPositionArea as et, supportsNativeCSSAnchorPosition as tt } from "./utils/supports.js";
-import { popoverStyles as nt } from "./styles/popover2.js";
-import { TransitionService as rt } from "./services/transition.service.js";
-import { statusIcons as it } from "./types/index.js";
-import { createLightDismiss as at, onKeys as ot } from "./utils/keynav.js";
-export { p as AuditController, e as DOCS_URL, g as GestureController, l as GlobalState, u as GlobalStateService, y as I18nController, _ as I18nService, v as I18nService_, ve as KeyNavigationGridController, xe as KeyNavigationListController, we as KeyNavigationSpatialController, P as KeynavCode, T as LogService, je as StateExpandedController, Ne as StateHighlightedController, Fe as StateScrollController, Le as StateSelectedController, rt as TransitionService, ze as TypeAnchorController, Ve as TypeClosableController, He as TypeExpandableController, We as TypeNativePopoverController, Ge as TypeSSRController, Ue as TypeSelectableController, F as appendAnchorName, I as appendRootNodeStyle, L as applySlotContentStates, Te as associateAriaDescribedBy, Ee as associateAriaLabel, De as associateControlGroup, Oe as associateDataList, ke as associateLabel, Ae as attachInternals, m as audit, d as auditParentElement, f as auditSlots, R as clickOutsideElementBounds, Ye as colorStateStyles, z as createGhostElement, at as createLightDismiss, x as debounce, r as deepMerge, B as define, V as defineElement, H as endOfScrollBox, h as excessiveInstanceLimit, E as focusElement, D as focusElementTimeout, t as formatFileSize, i as formatStandardNumber, U as generateId, O as getActiveElement, W as getAnchorNames, G as getAttributeChanges, K as getAttributeListChanges, q as getChildren, a as getDifference, J as getDisplayValue, Y as getElementUpdate, X as getFlattenedDOMTree, Z as getFlattenedFocusableItems, ye as getNextKeyGridItem, Se as getNextKeyListItem, Q as getPropertyChanges, $ as getThemeTokens, ee as hasHorizontalScrollBar, te as hasInvalidDOMGrid, ne as hasScrollBar, qe as hostAttr, b as i18n, k as initializeKeyListItems, re as isContextMenuClick, A as isFocusable, o as isObject, s as isObjectLiteral, j as isSimpleFocusable, be as keyNavigationGrid, Ce as keyNavigationList, ie as matchesElementName, S as onChildListMutation, ot as onKeys, M as onListboxActivate, ae as openEyeDropper, oe as parseTokenNumber, c as parseVersion, nt as popoverStyles, se as removeAnchorName, ce as removeEmptySlotWhitespace, le as removeEmptyTextNode, ue as sameOrderedStringArray, de as sameRenderRoot, Je as scopedRegistry, fe as scrollBarWidth, N as setActiveKeyListItem, n as shiftLeft, pe as slotContainsOnlyWhitespace, Me as stateExpanded, Pe as stateHighlighted, Ie as stateScroll, Re as stateSelected, it as statusIcons, Xe as statusStateStyles, C as stopEvent, me as styleSheetToString, Ze as supportStateStyles, $e as supportsCSSLegacyInsetArea, et as supportsCSSPositionArea, tt as supportsNativeCSSAnchorPosition, he as supportsScopedRegistry, w as throttle, Be as typeAnchor, Ke as typeSSR, ge as uniqueNonEmptyStrings, Qe as useStyles, _e as validKeyNavigationCode };
+import { KeyStateController as x } from "./controllers/key-state.controller.js";
+import { debounce as S, onChildListMutation as C, stopEvent as w, throttle as T } from "./utils/events.js";
+import { LogService as E } from "./services/log.service.js";
+import { focusElement as D, focusElementTimeout as O, getActiveElement as k, initializeKeyListItems as A, isFocusable as j, isImmediateRootActiveElement as M, isSimpleFocusable as N, onListboxActivate as P, setActiveKeyListItem as F } from "./utils/focus.js";
+import { KeynavCode as I, appendAnchorName as L, appendRootNodeStyle as R, applySlotContentStates as z, clickOutsideElementBounds as B, createGhostElement as V, define as H, defineElement as U, endOfScrollBox as W, generateId as G, getAnchorNames as K, getAttributeChanges as q, getAttributeListChanges as J, getChildren as Y, getCustomElementRegistry as X, getDisplayValue as Z, getElementUpdate as Q, getFlattenedDOMTree as $, getFlattenedFocusableItems as ee, getPropertyChanges as te, getThemeTokens as ne, hasHorizontalScrollBar as re, hasInvalidDOMGrid as ie, hasScrollBar as ae, isContextMenuClick as oe, matchesElementName as se, openEyeDropper as ce, parseTokenNumber as le, removeAnchorName as ue, removeEmptySlotWhitespace as de, removeEmptyTextNode as fe, sameOrderedStringArray as pe, sameRenderRoot as me, scrollBarWidth as he, slotContainsOnlyWhitespace as ge, styleSheetToString as _e, supportsScopedRegistry as ve, uniqueNonEmptyStrings as ye, validKeyNavigationCode as be } from "./utils/dom.js";
+import { KeyNavigationGridController as xe, getNextKeyGridItem as Se, keyNavigationGrid as Ce } from "./controllers/keynav-grid.controller.js";
+import { KeyNavigationListController as we, getNextKeyListItem as Te, keyNavigationList as Ee } from "./controllers/keynav-list.controller.js";
+import { KeyNavigationSpatialController as De } from "./controllers/keynav-spatial.controller.js";
+import { associateAriaDescribedBy as Oe, associateAriaLabel as ke, associateControlGroup as Ae, associateDataList as je, associateLabel as Me, attachInternals as Ne } from "./utils/a11y.js";
+import { StateExpandedController as Pe, stateExpanded as Fe } from "./controllers/state-expanded.controller.js";
+import { StateHighlightedController as Ie, stateHighlighted as Le } from "./controllers/state-highlighted.controller.js";
+import { StateScrollController as Re, stateScroll as ze } from "./controllers/state-scroll.controller.js";
+import { StateSelectedController as Be, stateSelected as Ve } from "./controllers/state-selected.controller.js";
+import { TypeAnchorController as He, typeAnchor as Ue } from "./controllers/type-anchor.controller.js";
+import { TypeClosableController as We } from "./controllers/type-closable.controller.js";
+import { TypeExpandableController as Ge } from "./controllers/type-expandable.controller.js";
+import { TypeSelectableController as Ke } from "./controllers/type-selectable.controller.js";
+import { TypeNativePopoverController as qe } from "./controllers/type-native-popover.controller.js";
+import { TypeSSRController as Je, typeSSR as Ye } from "./controllers/type-ssr.controller.js";
+import { hostAttr as Xe } from "./decorators/host-attr.js";
+import { scopedRegistry as Ze } from "./decorators/scoped-registry.js";
+import { colorStateStyles as Qe, statusStateStyles as $e, supportStateStyles as et, useStyles as tt } from "./styles/index.js";
+import { supportsCSSLegacyInsetArea as nt, supportsCSSPositionArea as rt, supportsNativeCSSAnchorPosition as it } from "./utils/supports.js";
+import { popoverStyles as at } from "./styles/popover2.js";
+import { TransitionService as ot } from "./services/transition.service.js";
+import { statusIcons as st } from "./types/index.js";
+import { createLightDismiss as ct, onKeys as lt } from "./utils/keynav.js";
+import { finiteOr as ut, nonnegativeFiniteOr as dt, positiveFiniteOr as ft } from "./utils/numeric.js";
+export { p as AuditController, e as DOCS_URL, g as GestureController, l as GlobalState, u as GlobalStateService, y as I18nController, _ as I18nService, v as I18nService_, xe as KeyNavigationGridController, we as KeyNavigationListController, De as KeyNavigationSpatialController, x as KeyStateController, I as KeynavCode, E as LogService, Pe as StateExpandedController, Ie as StateHighlightedController, Re as StateScrollController, Be as StateSelectedController, ot as TransitionService, He as TypeAnchorController, We as TypeClosableController, Ge as TypeExpandableController, qe as TypeNativePopoverController, Je as TypeSSRController, Ke as TypeSelectableController, L as appendAnchorName, R as appendRootNodeStyle, z as applySlotContentStates, Oe as associateAriaDescribedBy, ke as associateAriaLabel, Ae as associateControlGroup, je as associateDataList, Me as associateLabel, Ne as attachInternals, m as audit, d as auditParentElement, f as auditSlots, B as clickOutsideElementBounds, Qe as colorStateStyles, V as createGhostElement, ct as createLightDismiss, S as debounce, r as deepMerge, H as define, U as defineElement, W as endOfScrollBox, h as excessiveInstanceLimit, ut as finiteOr, D as focusElement, O as focusElementTimeout, t as formatFileSize, i as formatStandardNumber, G as generateId, k as getActiveElement, K as getAnchorNames, q as getAttributeChanges, J as getAttributeListChanges, Y as getChildren, X as getCustomElementRegistry, a as getDifference, Z as getDisplayValue, Q as getElementUpdate, $ as getFlattenedDOMTree, ee as getFlattenedFocusableItems, Se as getNextKeyGridItem, Te as getNextKeyListItem, te as getPropertyChanges, ne as getThemeTokens, re as hasHorizontalScrollBar, ie as hasInvalidDOMGrid, ae as hasScrollBar, Xe as hostAttr, b as i18n, A as initializeKeyListItems, oe as isContextMenuClick, j as isFocusable, M as isImmediateRootActiveElement, o as isObject, s as isObjectLiteral, N as isSimpleFocusable, Ce as keyNavigationGrid, Ee as keyNavigationList, se as matchesElementName, dt as nonnegativeFiniteOr, C as onChildListMutation, lt as onKeys, P as onListboxActivate, ce as openEyeDropper, le as parseTokenNumber, c as parseVersion, at as popoverStyles, ft as positiveFiniteOr, ue as removeAnchorName, de as removeEmptySlotWhitespace, fe as removeEmptyTextNode, pe as sameOrderedStringArray, me as sameRenderRoot, Ze as scopedRegistry, he as scrollBarWidth, F as setActiveKeyListItem, n as shiftLeft, ge as slotContainsOnlyWhitespace, Fe as stateExpanded, Le as stateHighlighted, ze as stateScroll, Ve as stateSelected, st as statusIcons, $e as statusStateStyles, w as stopEvent, _e as styleSheetToString, et as supportStateStyles, nt as supportsCSSLegacyInsetArea, rt as supportsCSSPositionArea, it as supportsNativeCSSAnchorPosition, ve as supportsScopedRegistry, T as throttle, Ue as typeAnchor, Ye as typeSSR, ye as uniqueNonEmptyStrings, tt as useStyles, be as validKeyNavigationCode };

package/dist/internal/services/global.service.js

@@ -19,7 +19,7 @@ var a = class {
 				i18nRegistry: {},
 				audit: {}
 			}
-		}, globalThis.NVE_ELEMENTS.state.versions = Array.from(/* @__PURE__ */ new Set([...globalThis.NVE_ELEMENTS.state.versions, "2.8.1"])), globalThis.NVE_ELEMENTS.state.scopedRegistry ??= {}, globalThis.NVE_ELEMENTS.state.scopedRegistry["2.8.1"] = i(), globalThis.NVE_ELEMENTS.state.versions.length > 1 && globalThis.NVE_ELEMENTS.state.env !== "production" && console.warn(e(), `\n\n${JSON.stringify(globalThis.NVE_ELEMENTS.state.versions, null, 2)}`);
+		}, globalThis.NVE_ELEMENTS.state.versions = Array.from(/* @__PURE__ */ new Set([...globalThis.NVE_ELEMENTS.state.versions, "2.10.0"])), globalThis.NVE_ELEMENTS.state.scopedRegistry ??= {}, globalThis.NVE_ELEMENTS.state.scopedRegistry["2.10.0"] = i(), globalThis.NVE_ELEMENTS.state.versions.length > 1 && globalThis.NVE_ELEMENTS.state.env !== "production" && console.warn(e(), `\n\n${JSON.stringify(globalThis.NVE_ELEMENTS.state.versions, null, 2)}`);
 	}
 	get state() {
 		return globalThis.NVE_ELEMENTS.state;

package/dist/internal/utils/dom.d.ts

@@ -16,6 +16,7 @@ export declare function getElementUpdate(element: HTMLElement, key: string, call
 export declare function clickOutsideElementBounds(event: PointerEvent | MouseEvent, element: HTMLElement): boolean;
 /** parses number out of basic calc generated by the design tokens */
 export declare function parseTokenNumber(value: string): number;
+export declare function getCustomElementRegistry(element: Element): CustomElementRegistry | undefined;
 /** true if the browser supports scoped custom element registries */
 export declare const supportsScopedRegistry: boolean;
 /** defines an element with the given custom element registry */
@@ -31,7 +32,9 @@ export declare function getFlattenedFocusableItems(element: Node, depth?: number
  * https://www.abeautifulsite.net/posts/querying-through-shadow-roots/
  */
 export declare function getFlattenedDOMTree(node: Node, depth?: number): HTMLElement[];
-export declare function validKeyNavigationCode(e: KeyboardEvent): boolean;
+export declare function validKeyNavigationCode(e: KeyboardEvent): e is KeyboardEvent & {
+    code: KeynavCode;
+};
 export declare enum KeynavCode {
     End = "End",
     Home = "Home",

package/dist/internal/utils/dom.js

@@ -78,53 +78,57 @@ function d(e, t) {
 function f(e) {
 	return parseInt(e.includes("calc") ? e.split("*")[1].replace("px)", "").trim() : e, 10) || 0;
 }
-var p = globalThis.CustomElementRegistry && "initialize" in CustomElementRegistry.prototype;
-function m(t, n) {
+function p(e) {
+	let t = e.getRootNode(), n = e.ownerDocument.defaultView?.CustomElementRegistry ?? globalThis.CustomElementRegistry;
+	return n && "customElementRegistry" in t && t.customElementRegistry instanceof n ? t.customElementRegistry : e.ownerDocument.defaultView?.customElements || (typeof customElements > "u" ? void 0 : customElements);
+}
+var m = globalThis.CustomElementRegistry && "initialize" in CustomElementRegistry.prototype;
+function h(t, n) {
 	Object.entries(t.elementDefinitions ?? {}).filter(([e, t]) => !n.get(t.metadata.tag)).forEach(([e, t]) => {
-		m(t, n);
+		h(t, n);
 	}), n.get(t.metadata.tag) || (n.define(t.metadata.tag, t), n === customElements && e.dispatch("NVE_ELEMENT_DEFINE", { elementRegistry: { [t.metadata.tag]: t.metadata.version } }));
 }
-function h(t) {
+function g(t) {
 	let { version: n } = t.metadata;
-	p && !customElements.get(t.metadata.tag) ? (customElements.define(t.metadata.tag, t), e.dispatch("NVE_ELEMENT_DEFINE", { elementRegistry: { [t.metadata.tag]: t.metadata.version } })) : m(t, customElements), e.state.elementRegistry[t.metadata.tag] !== n && globalThis?.location?.hostname === "localhost" && import("./audit-logs.js").then((e) => console.warn(e.getDuplicatePackageVersionWarning(t.metadata.tag, n)));
+	m && !customElements.get(t.metadata.tag) ? (customElements.define(t.metadata.tag, t), e.dispatch("NVE_ELEMENT_DEFINE", { elementRegistry: { [t.metadata.tag]: t.metadata.version } })) : h(t, customElements), e.state.elementRegistry[t.metadata.tag] !== n && globalThis?.location?.hostname === "localhost" && import("./audit-logs.js").then((e) => console.warn(e.getDuplicatePackageVersionWarning(t.metadata.tag, n)));
 }
-function g(e) {
+function _(e) {
 	return e.buttons === 2 && !e.ctrlKey || e.buttons === 1 && e.ctrlKey;
 }
-function _(e, t = 10) {
-	return v(e, t).filter((e) => n(e));
-}
 function v(e, t = 10) {
-	return Array.from(r(e)).reduce((e, n) => [...e, [n, [...Array.from(r(n)).map((e) => [e, v(e, t)])]]], []).flat(t);
+	return y(e, t).filter((e) => n(e));
 }
-function y(e) {
-	return x.has(e.code);
+function y(e, t = 10) {
+	return Array.from(r(e)).reduce((e, n) => [...e, [n, [...Array.from(r(n)).map((e) => [e, y(e, t)])]]], []).flat(t);
 }
-var b = /* @__PURE__ */ function(e) {
+function b(e) {
+	return S.has(e.code);
+}
+var x = /* @__PURE__ */ function(e) {
 	return e.End = "End", e.Home = "Home", e.PageUp = "PageUp", e.PageDown = "PageDown", e.ArrowUp = "ArrowUp", e.ArrowDown = "ArrowDown", e.ArrowLeft = "ArrowLeft", e.ArrowRight = "ArrowRight", e;
-}({}), x = new Set(Object.values(b));
-function S(e) {
+}({}), S = new Set(Object.values(x));
+function C(e) {
 	return e.some((t) => t.children.length !== e[0].children.length);
 }
-function C(e) {
+function w(e) {
 	e?.wholeText?.trim() === "" && e.remove();
 }
-function w() {
+function T() {
 	let e = globalThis.document.createElement("div");
 	e.style.setProperty("width", "100px"), e.style.setProperty("height", "100px"), e.style.setProperty("overflow", "scroll"), e.style.setProperty("position", "absolute"), e.style.setProperty("top", "-9999px"), globalThis.document.body.appendChild(e);
 	let t = e.offsetWidth - e.clientWidth;
 	return globalThis.document.body.removeChild(e), t;
 }
-function T(e) {
+function E(e) {
 	return e.scrollHeight > e.clientHeight;
 }
-function E(e) {
+function D(e) {
 	return e.scrollWidth > e.clientWidth;
 }
-function D(e, t = 0) {
+function O(e, t = 0) {
 	return e.scrollTop + e.offsetHeight + t >= e.scrollHeight;
 }
-async function O() {
+async function k() {
 	let e = globalThis.EyeDropper;
 	if (!e) return t.warn("EyeDropper API is unavailable"), "";
 	try {
@@ -133,7 +137,7 @@ async function O() {
 		return t.warn(`EyeDropper selection failed: ${e.message}`), "";
 	}
 }
-function k(e = globalThis.document.querySelector(":root")) {
+function A(e = globalThis.document.querySelector(":root")) {
 	let t = getComputedStyle(e), n = [];
 	try {
 		n = Array.from(globalThis.parent.document.styleSheets);
@@ -152,48 +156,48 @@ function k(e = globalThis.document.querySelector(":root")) {
 		[n[0]]: t.getPropertyValue(n[0])
 	}), {});
 }
-function A(e) {
-	j(e) && e.assignedNodes().forEach((e) => e.parentNode?.removeChild(e));
-}
 function j(e) {
+	M(e) && e.assignedNodes().forEach((e) => e.parentNode?.removeChild(e));
+}
+function M(e) {
 	let t = !e.assignedNodes().find((e) => e.nodeType !== Node.TEXT_NODE), n = !e.assignedNodes().find((e) => e.nodeType === Node.TEXT_NODE && (e.textContent ?? "").trim() !== "");
 	return t && n;
 }
-function M(e, t) {
+function N(e, t) {
 	let n = e.assignedNodes(), r = e.name ?? "slot";
 	n.length ? t._internals.states.add(`has-${r}`) : t._internals.states.delete(`has-${r}`);
 }
-function N(e) {
+function P(e) {
 	return e?.label || e?.value || "";
 }
-function P(e, t) {
+function F(e, t) {
 	return e.localName === t.metadata.tag;
 }
-function F(e) {
+function I(e) {
 	let t = globalThis.document.createElement("div"), { width: n } = e.getBoundingClientRect();
 	return t.setAttribute("nve-ghost", ""), t.style.minWidth = `${n}px`, t.style.maxWidth = `${n}px`, t.style.height = "1px", t.slot = e.slot, t;
 }
-function I(e, t) {
+function L(e, t) {
 	let n = e.getRootNode(), r = t.getRootNode(), i = n instanceof ShadowRoot && r instanceof ShadowRoot && n === r, a = n === globalThis.document && r === globalThis.document;
 	return i || a || n === r;
 }
-function L(e) {
+function R(e) {
 	return e.style.anchorName?.split(",")?.map((e) => e.trim())?.filter((e) => e !== "none" && e !== "") ?? [];
 }
-function R(e, t) {
-	let n = L(e);
-	e.style.anchorName = n.filter((e) => e !== t).join(",");
-}
 function z(e, t) {
-	e.style.anchorName = Array.from(/* @__PURE__ */ new Set([...L(e), t])).join(",");
+	let n = R(e);
+	e.style.anchorName = n.filter((e) => e !== t).join(",");
 }
 function B(e, t) {
+	e.style.anchorName = Array.from(/* @__PURE__ */ new Set([...R(e), t])).join(",");
+}
+function V(e, t) {
 	return e.length === t.length && e.every((e, n) => e === t[n]);
 }
-function V(e) {
+function H(e) {
 	return Array.from(new Set(Array.from(e).filter((e) => typeof e == "string" && e.length > 0)));
 }
 //#endregion
-export { b as KeynavCode, z as appendAnchorName, s as appendRootNodeStyle, M as applySlotContentStates, d as clickOutsideElementBounds, F as createGhostElement, h as define, m as defineElement, D as endOfScrollBox, i as generateId, L as getAnchorNames, a as getAttributeChanges, o as getAttributeListChanges, r as getChildren, N as getDisplayValue, u as getElementUpdate, v as getFlattenedDOMTree, _ as getFlattenedFocusableItems, l as getPropertyChanges, k as getThemeTokens, E as hasHorizontalScrollBar, S as hasInvalidDOMGrid, T as hasScrollBar, g as isContextMenuClick, P as matchesElementName, O as openEyeDropper, f as parseTokenNumber, R as removeAnchorName, A as removeEmptySlotWhitespace, C as removeEmptyTextNode, B as sameOrderedStringArray, I as sameRenderRoot, w as scrollBarWidth, j as slotContainsOnlyWhitespace, c as styleSheetToString, p as supportsScopedRegistry, V as uniqueNonEmptyStrings, y as validKeyNavigationCode };
+export { x as KeynavCode, B as appendAnchorName, s as appendRootNodeStyle, N as applySlotContentStates, d as clickOutsideElementBounds, I as createGhostElement, g as define, h as defineElement, O as endOfScrollBox, i as generateId, R as getAnchorNames, a as getAttributeChanges, o as getAttributeListChanges, r as getChildren, p as getCustomElementRegistry, P as getDisplayValue, u as getElementUpdate, y as getFlattenedDOMTree, v as getFlattenedFocusableItems, l as getPropertyChanges, A as getThemeTokens, D as hasHorizontalScrollBar, C as hasInvalidDOMGrid, E as hasScrollBar, _ as isContextMenuClick, F as matchesElementName, k as openEyeDropper, f as parseTokenNumber, z as removeAnchorName, j as removeEmptySlotWhitespace, w as removeEmptyTextNode, V as sameOrderedStringArray, L as sameRenderRoot, T as scrollBarWidth, M as slotContainsOnlyWhitespace, c as styleSheetToString, m as supportsScopedRegistry, H as uniqueNonEmptyStrings, b as validKeyNavigationCode };
 
 //# sourceMappingURL=dom.js.map