@tanstack/lit-hotkeys 0.0.1

package/README.md

@@ -0,0 +1,123 @@
+<div align="center">
+  <img src="./media/header_hotkeys.png" alt="TanStack Hotkeys" />
+</div>
+
+<br />
+
+<div align="center">
+	<a href="https://www.npmjs.com/package/@tanstack/hotkeys" target="\_parent">
+	  <img alt="" src="https://img.shields.io/npm/dm/@tanstack/hotkeys.svg" alt="npm downloads" />
+	</a>
+	<a href="https://github.com/TanStack/hotkeys" target="\_parent">
+	  <img alt="" src="https://img.shields.io/github/stars/TanStack/hotkeys.svg?style=social&label=Star" alt="GitHub stars" />
+	</a>
+	<a href="https://bundlephobia.com/result?p=@tanstack/react-hotkeys@latest" target="\_parent">
+	  <img alt="" src="https://badgen.net/bundlephobia/minzip/@tanstack/react-hotkeys@latest" alt="Bundle size" />
+	</a>
+</div>
+
+<div align="center">
+	<a href="#badge">
+	  <img alt="semantic-release" src="https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg">
+	</a>
+	<a href="#badge">
+	  <img src="https://img.shields.io/github/v/release/tanstack/hotkeys" alt="Release"/>
+	</a>
+	<a href="https://twitter.com/tan_stack">
+	  <img src="https://img.shields.io/twitter/follow/tan_stack.svg?style=social" alt="Follow @TanStack"/>
+	</a>
+</div>
+
+<div align="center">
+
+### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)
+
+</div>
+
+# TanStack Hotkeys
+
+> [!NOTE]
+> TanStack Hotkeys is alpha. We are actively developing the library and are open to feedback and contributions.
+
+Type-safe keyboard shortcuts for the web. Template-string bindings, parsed objects, a cross-platform `Mod` key, a singleton Hotkey Manager, and utilities for cheatsheet UIs—built to stay SSR-friendly.
+
+- Type-safe bindings — template strings (`Mod+Shift+S`, `Escape`) or parsed objects for full control
+- Flexible options — `keydown`/`keyup`, `preventDefault`, `stopPropagation`, conditional enabled, `requireReset`
+- Cross-platform Mod — maps to Cmd on macOS and Ctrl on Windows/Linux
+- Batteries included — validation + matching, sequences (Vim-style), key-state tracking, recorder UI helpers, framework adapters, and devtools
+
+### <a href="https://tanstack.com/hotkeys">Read the docs →</a>
+
+<br />
+
+> [!NOTE]
+> You may know **TanStack Hotkeys** by our adapter names, too!
+>
+> - [**React Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/react/react-hotkeys)
+> - [**Preact Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/preact/preact-hotkeys)
+> - [**Solid Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/solid/reference)
+> - [**Angular Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/angular/reference)
+> - [**Vue Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/vue/reference)
+> - [**Lit Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/lit/reference)
+> - [**Svelte Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/svelte/reference)
+
+## Get Involved
+
+- We welcome issues and pull requests!
+- Participate in [GitHub discussions](https://github.com/TanStack/hotkeys/discussions)
+- Chat with the community on [Discord](https://discord.com/invite/WrRKjPJ)
+- See [CONTRIBUTING.md](./CONTRIBUTING.md) for setup instructions
+
+## Partners
+
+<div align="center">
+
+<table align="center">
+  <tr>
+    <td>
+      <a href="https://www.coderabbit.ai/?via=tanstack&dub_id=aCcEEdAOqqutX6OS" >
+        <picture>
+          <source media="(prefers-color-scheme: dark)" srcset="https://tanstack.com/assets/coderabbit-dark-D643Zkrv.svg" height="40" />
+          <source media="(prefers-color-scheme: light)" srcset="https://tanstack.com/assets/coderabbit-light-CIzGLYU_.svg" height="40" />
+          <img src="https://tanstack.com/assets/coderabbit-light-DVMJ2jHi.svg" height="40" alt="CodeRabbit" />
+        </picture>
+      </a>
+    </td>
+    <td>
+      <a href="https://www.cloudflare.com?utm_source=tanstack">
+        <picture>
+          <source media="(prefers-color-scheme: dark)" srcset="https://tanstack.com/assets/cloudflare-white-Co-Tyjbl.svg" height="60" />
+          <source media="(prefers-color-scheme: light)" srcset="https://tanstack.com/assets/cloudflare-black-6Ojsn8yh.svg" height="60" />
+          <img src="https://tanstack.com/assets/cloudflare-black-CPufaW0B.svg" height="60" alt="Cloudflare" />
+        </picture>
+      </a>
+    </td>
+  </tr>
+</table>
+
+<div align="center">
+<img src="media/partner_logo.svg" alt="Keys & you?" height="65">
+<p>
+We're looking for TanStack Hotkeys Partners to join our mission! Partner with us to push the boundaries of TanStack Hotkeys and build amazing things together.
+</p>
+<a href="mailto:partners@tanstack.com?subject=TanStack Hotkeys Partnership"><b>LET'S CHAT</b></a>
+</div>
+
+</div>
+
+## Explore the TanStack Ecosystem
+
+- <a href="https://github.com/tanstack/config"><b>TanStack Config</b></a> – Tooling for JS/TS packages
+- <a href="https://github.com/tanstack/db"><b>TanStack DB</b></a> – Reactive sync client store
+- <a href="https://github.com/tanstack/devtools"><b>TanStack DevTools</b></a> – Unified devtools panel
+- <a href="https://github.com/tanstack/form"><b>TanStack Form</b></a> – Type‑safe form state
+- <a href="https://github.com/tanstack/hotkeys"><b>TanStack Hotkeys</b></a> – Type‑safe keyboard shortcuts
+- <a href="https://github.com/tanstack/query"><b>TanStack Query</b></a> – Async state & caching
+- <a href="https://github.com/tanstack/ranger"><b>TanStack Ranger</b></a> – Range & slider primitives
+- <a href="https://github.com/tanstack/router"><b>TanStack Router</b></a> – Type‑safe routing, caching & URL state
+- <a href="https://github.com/tanstack/start"><b>TanStack Start</b></a> – Full‑stack SSR & streaming
+- <a href="https://github.com/tanstack/store"><b>TanStack Store</b></a> – Reactive data store
+- <a href="https://github.com/tanstack/table"><b>TanStack Table</b></a> – Headless datagrids
+- <a href="https://github.com/tanstack/virtual"><b>TanStack Virtual</b></a> – Virtualized rendering
+
+… and more at <a href="https://tanstack.com"><b>TanStack.com »</b></a>

package/dist/constants.cjs

@@ -0,0 +1,27 @@
+
+//#region src/constants.ts
+const HOTKEY_DEFAULT_OPTIONS = {
+	enabled: true,
+	preventDefault: true,
+	stopPropagation: true,
+	eventType: "keydown",
+	requireReset: false,
+	ignoreInputs: void 0,
+	platform: void 0,
+	conflictBehavior: "warn"
+};
+const HOTKEY_SEQUENCE_DEFAULT_OPTIONS = {
+	enabled: true,
+	timeout: 1e3,
+	preventDefault: true,
+	stopPropagation: true,
+	eventType: "keydown",
+	ignoreInputs: void 0,
+	platform: void 0,
+	conflictBehavior: "warn"
+};
+
+//#endregion
+exports.HOTKEY_DEFAULT_OPTIONS = HOTKEY_DEFAULT_OPTIONS;
+exports.HOTKEY_SEQUENCE_DEFAULT_OPTIONS = HOTKEY_SEQUENCE_DEFAULT_OPTIONS;
+//# sourceMappingURL=constants.cjs.map

package/dist/constants.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.cjs","names":[],"sources":["../src/constants.ts"],"sourcesContent":["import type { HotkeyOptions, SequenceOptions } from '@tanstack/hotkeys'\n\nexport const HOTKEY_DEFAULT_OPTIONS: HotkeyOptions = {\n  enabled: true,\n  preventDefault: true,\n  stopPropagation: true,\n  eventType: 'keydown',\n  requireReset: false,\n  ignoreInputs: undefined, // smart default: false for Mod+S, true for single keys\n  platform: undefined, // auto-detected\n  conflictBehavior: 'warn',\n}\n\nexport const HOTKEY_SEQUENCE_DEFAULT_OPTIONS: SequenceOptions = {\n  enabled: true,\n  timeout: 1000,\n  preventDefault: true,\n  stopPropagation: true,\n  eventType: 'keydown',\n  ignoreInputs: undefined, // smart default: false for Mod+S, true for single keys\n  platform: undefined, // auto-detected\n  conflictBehavior: 'warn',\n}\n"],"mappings":";;AAEA,MAAa,yBAAwC;CACnD,SAAS;CACT,gBAAgB;CAChB,iBAAiB;CACjB,WAAW;CACX,cAAc;CACd,cAAc;CACd,UAAU;CACV,kBAAkB;CACnB;AAED,MAAa,kCAAmD;CAC9D,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,iBAAiB;CACjB,WAAW;CACX,cAAc;CACd,UAAU;CACV,kBAAkB;CACnB"}

package/dist/constants.js

@@ -0,0 +1,25 @@
+//#region src/constants.ts
+const HOTKEY_DEFAULT_OPTIONS = {
+	enabled: true,
+	preventDefault: true,
+	stopPropagation: true,
+	eventType: "keydown",
+	requireReset: false,
+	ignoreInputs: void 0,
+	platform: void 0,
+	conflictBehavior: "warn"
+};
+const HOTKEY_SEQUENCE_DEFAULT_OPTIONS = {
+	enabled: true,
+	timeout: 1e3,
+	preventDefault: true,
+	stopPropagation: true,
+	eventType: "keydown",
+	ignoreInputs: void 0,
+	platform: void 0,
+	conflictBehavior: "warn"
+};
+
+//#endregion
+export { HOTKEY_DEFAULT_OPTIONS, HOTKEY_SEQUENCE_DEFAULT_OPTIONS };
+//# sourceMappingURL=constants.js.map

package/dist/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","names":[],"sources":["../src/constants.ts"],"sourcesContent":["import type { HotkeyOptions, SequenceOptions } from '@tanstack/hotkeys'\n\nexport const HOTKEY_DEFAULT_OPTIONS: HotkeyOptions = {\n  enabled: true,\n  preventDefault: true,\n  stopPropagation: true,\n  eventType: 'keydown',\n  requireReset: false,\n  ignoreInputs: undefined, // smart default: false for Mod+S, true for single keys\n  platform: undefined, // auto-detected\n  conflictBehavior: 'warn',\n}\n\nexport const HOTKEY_SEQUENCE_DEFAULT_OPTIONS: SequenceOptions = {\n  enabled: true,\n  timeout: 1000,\n  preventDefault: true,\n  stopPropagation: true,\n  eventType: 'keydown',\n  ignoreInputs: undefined, // smart default: false for Mod+S, true for single keys\n  platform: undefined, // auto-detected\n  conflictBehavior: 'warn',\n}\n"],"mappings":";AAEA,MAAa,yBAAwC;CACnD,SAAS;CACT,gBAAgB;CAChB,iBAAiB;CACjB,WAAW;CACX,cAAc;CACd,cAAc;CACd,UAAU;CACV,kBAAkB;CACnB;AAED,MAAa,kCAAmD;CAC9D,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,iBAAiB;CACjB,WAAW;CACX,cAAc;CACd,UAAU;CACV,kBAAkB;CACnB"}

package/dist/controllers/held-key-codes.cjs

@@ -0,0 +1,61 @@
+let _tanstack_hotkeys = require("@tanstack/hotkeys");
+
+//#region src/controllers/held-key-codes.ts
+/**
+* A Lit ReactiveController that tracks all currently held key names to their physical `event.code` values.
+*
+* Subscribes to the global KeyStateTracker and triggers host updates
+* whenever keys are pressed or released.
+*
+* @example
+* ```ts
+* class KeyDisplay extends LitElement {
+*   private heldKeyCodes = new HeldKeyCodesController(this)
+*
+*   render() {
+*     const heldCodes = Object.entries(this.heldKeyCodes.value).map(([key, code]) => `${key}: ${code}`).join(' + ')
+*     return html`
+*       <div>
+*         Currently pressed: ${heldCodes || 'None'}
+*       </div>
+*     `
+*   }
+* }
+* ```
+*/
+var HeldKeyCodesController = class {
+	/** Map of currently held key names to their physical `event.code` values. */
+	get value() {
+		return this._value;
+	}
+	/**
+	* @param _host - The Lit component that owns this controller.
+	*/
+	constructor(_host) {
+		this._host = _host;
+		this._value = {};
+		this._host.addController(this);
+	}
+	/** Subscribes to the tracker store and updates the internal state when changes occur. */
+	hostConnected() {
+		const tracker = (0, _tanstack_hotkeys.getKeyStateTracker)();
+		this._value = tracker.store.state.heldCodes;
+		this._host.requestUpdate();
+		const subscription = tracker.store.subscribe(() => {
+			const { heldCodes } = tracker.store.state;
+			this._value = heldCodes;
+			this._host.requestUpdate();
+		});
+		this._unsubscribe = () => subscription.unsubscribe();
+	}
+	/** Unsubscribes from the tracker store and stops tracking the held key codes. */
+	hostDisconnected() {
+		this._unsubscribe?.();
+		this._unsubscribe = void 0;
+		this._value = {};
+	}
+};
+
+//#endregion
+exports.HeldKeyCodesController = HeldKeyCodesController;
+//# sourceMappingURL=held-key-codes.cjs.map

package/dist/controllers/held-key-codes.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"held-key-codes.cjs","names":[],"sources":["../../src/controllers/held-key-codes.ts"],"sourcesContent":["import { getKeyStateTracker } from '@tanstack/hotkeys'\nimport type { KeyStateTracker } from '@tanstack/hotkeys'\nimport type { ReactiveController, ReactiveControllerHost } from 'lit'\n\n/**\n * A Lit ReactiveController that tracks all currently held key names to their physical `event.code` values.\n *\n * Subscribes to the global KeyStateTracker and triggers host updates\n * whenever keys are pressed or released.\n *\n * @example\n * ```ts\n * class KeyDisplay extends LitElement {\n *   private heldKeyCodes = new HeldKeyCodesController(this)\n *\n *   render() {\n *     const heldCodes = Object.entries(this.heldKeyCodes.value).map(([key, code]) => `${key}: ${code}`).join(' + ')\n *     return html`\n *       <div>\n *         Currently pressed: ${heldCodes || 'None'}\n *       </div>\n *     `\n *   }\n * }\n * ```\n */\nexport class HeldKeyCodesController implements ReactiveController {\n  /** The unsubscribe function to unsubscribe from the tracker store. */\n  private _unsubscribe: (() => void) | undefined\n  /** The currently held key names to their physical `event.code` values. */\n  private _value: Record<string, string> = {}\n\n  /** Map of currently held key names to their physical `event.code` values. */\n  public get value(): Record<string, string> {\n    return this._value\n  }\n\n  /**\n   * @param _host - The Lit component that owns this controller.\n   */\n  constructor(private _host: ReactiveControllerHost) {\n    this._host.addController(this)\n  }\n\n  /** Subscribes to the tracker store and updates the internal state when changes occur. */\n  public hostConnected(): void {\n    const tracker: KeyStateTracker = getKeyStateTracker()\n    this._value = tracker.store.state.heldCodes\n    this._host.requestUpdate()\n\n    const subscription = tracker.store.subscribe(() => {\n      const { heldCodes } = tracker.store.state\n\n      this._value = heldCodes\n      this._host.requestUpdate()\n    })\n\n    this._unsubscribe = () => subscription.unsubscribe()\n  }\n\n  /** Unsubscribes from the tracker store and stops tracking the held key codes. */\n  public hostDisconnected(): void {\n    this._unsubscribe?.()\n    this._unsubscribe = undefined\n    this._value = {}\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,IAAa,yBAAb,MAAkE;;CAOhE,IAAW,QAAgC;AACzC,SAAO,KAAK;;;;;CAMd,YAAY,AAAQ,OAA+B;EAA/B;gBAVqB,EAAE;AAWzC,OAAK,MAAM,cAAc,KAAK;;;CAIhC,AAAO,gBAAsB;EAC3B,MAAM,qDAA+C;AACrD,OAAK,SAAS,QAAQ,MAAM,MAAM;AAClC,OAAK,MAAM,eAAe;EAE1B,MAAM,eAAe,QAAQ,MAAM,gBAAgB;GACjD,MAAM,EAAE,cAAc,QAAQ,MAAM;AAEpC,QAAK,SAAS;AACd,QAAK,MAAM,eAAe;IAC1B;AAEF,OAAK,qBAAqB,aAAa,aAAa;;;CAItD,AAAO,mBAAyB;AAC9B,OAAK,gBAAgB;AACrB,OAAK,eAAe;AACpB,OAAK,SAAS,EAAE"}

package/dist/controllers/held-key-codes.d.cts

@@ -0,0 +1,45 @@
+import { ReactiveController, ReactiveControllerHost } from "lit";
+
+//#region src/controllers/held-key-codes.d.ts
+/**
+ * A Lit ReactiveController that tracks all currently held key names to their physical `event.code` values.
+ *
+ * Subscribes to the global KeyStateTracker and triggers host updates
+ * whenever keys are pressed or released.
+ *
+ * @example
+ * ```ts
+ * class KeyDisplay extends LitElement {
+ *   private heldKeyCodes = new HeldKeyCodesController(this)
+ *
+ *   render() {
+ *     const heldCodes = Object.entries(this.heldKeyCodes.value).map(([key, code]) => `${key}: ${code}`).join(' + ')
+ *     return html`
+ *       <div>
+ *         Currently pressed: ${heldCodes || 'None'}
+ *       </div>
+ *     `
+ *   }
+ * }
+ * ```
+ */
+declare class HeldKeyCodesController implements ReactiveController {
+  private _host;
+  /** The unsubscribe function to unsubscribe from the tracker store. */
+  private _unsubscribe;
+  /** The currently held key names to their physical `event.code` values. */
+  private _value;
+  /** Map of currently held key names to their physical `event.code` values. */
+  get value(): Record<string, string>;
+  /**
+   * @param _host - The Lit component that owns this controller.
+   */
+  constructor(_host: ReactiveControllerHost);
+  /** Subscribes to the tracker store and updates the internal state when changes occur. */
+  hostConnected(): void;
+  /** Unsubscribes from the tracker store and stops tracking the held key codes. */
+  hostDisconnected(): void;
+}
+//#endregion
+export { HeldKeyCodesController };
+//# sourceMappingURL=held-key-codes.d.cts.map

package/dist/controllers/held-key-codes.d.ts

@@ -0,0 +1,45 @@
+import { ReactiveController, ReactiveControllerHost } from "lit";
+
+//#region src/controllers/held-key-codes.d.ts
+/**
+ * A Lit ReactiveController that tracks all currently held key names to their physical `event.code` values.
+ *
+ * Subscribes to the global KeyStateTracker and triggers host updates
+ * whenever keys are pressed or released.
+ *
+ * @example
+ * ```ts
+ * class KeyDisplay extends LitElement {
+ *   private heldKeyCodes = new HeldKeyCodesController(this)
+ *
+ *   render() {
+ *     const heldCodes = Object.entries(this.heldKeyCodes.value).map(([key, code]) => `${key}: ${code}`).join(' + ')
+ *     return html`
+ *       <div>
+ *         Currently pressed: ${heldCodes || 'None'}
+ *       </div>
+ *     `
+ *   }
+ * }
+ * ```
+ */
+declare class HeldKeyCodesController implements ReactiveController {
+  private _host;
+  /** The unsubscribe function to unsubscribe from the tracker store. */
+  private _unsubscribe;
+  /** The currently held key names to their physical `event.code` values. */
+  private _value;
+  /** Map of currently held key names to their physical `event.code` values. */
+  get value(): Record<string, string>;
+  /**
+   * @param _host - The Lit component that owns this controller.
+   */
+  constructor(_host: ReactiveControllerHost);
+  /** Subscribes to the tracker store and updates the internal state when changes occur. */
+  hostConnected(): void;
+  /** Unsubscribes from the tracker store and stops tracking the held key codes. */
+  hostDisconnected(): void;
+}
+//#endregion
+export { HeldKeyCodesController };
+//# sourceMappingURL=held-key-codes.d.ts.map

package/dist/controllers/held-key-codes.js

@@ -0,0 +1,61 @@
+import { getKeyStateTracker } from "@tanstack/hotkeys";
+
+//#region src/controllers/held-key-codes.ts
+/**
+* A Lit ReactiveController that tracks all currently held key names to their physical `event.code` values.
+*
+* Subscribes to the global KeyStateTracker and triggers host updates
+* whenever keys are pressed or released.
+*
+* @example
+* ```ts
+* class KeyDisplay extends LitElement {
+*   private heldKeyCodes = new HeldKeyCodesController(this)
+*
+*   render() {
+*     const heldCodes = Object.entries(this.heldKeyCodes.value).map(([key, code]) => `${key}: ${code}`).join(' + ')
+*     return html`
+*       <div>
+*         Currently pressed: ${heldCodes || 'None'}
+*       </div>
+*     `
+*   }
+* }
+* ```
+*/
+var HeldKeyCodesController = class {
+	/** Map of currently held key names to their physical `event.code` values. */
+	get value() {
+		return this._value;
+	}
+	/**
+	* @param _host - The Lit component that owns this controller.
+	*/
+	constructor(_host) {
+		this._host = _host;
+		this._value = {};
+		this._host.addController(this);
+	}
+	/** Subscribes to the tracker store and updates the internal state when changes occur. */
+	hostConnected() {
+		const tracker = getKeyStateTracker();
+		this._value = tracker.store.state.heldCodes;
+		this._host.requestUpdate();
+		const subscription = tracker.store.subscribe(() => {
+			const { heldCodes } = tracker.store.state;
+			this._value = heldCodes;
+			this._host.requestUpdate();
+		});
+		this._unsubscribe = () => subscription.unsubscribe();
+	}
+	/** Unsubscribes from the tracker store and stops tracking the held key codes. */
+	hostDisconnected() {
+		this._unsubscribe?.();
+		this._unsubscribe = void 0;
+		this._value = {};
+	}
+};
+
+//#endregion
+export { HeldKeyCodesController };
+//# sourceMappingURL=held-key-codes.js.map

package/dist/controllers/held-key-codes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"held-key-codes.js","names":[],"sources":["../../src/controllers/held-key-codes.ts"],"sourcesContent":["import { getKeyStateTracker } from '@tanstack/hotkeys'\nimport type { KeyStateTracker } from '@tanstack/hotkeys'\nimport type { ReactiveController, ReactiveControllerHost } from 'lit'\n\n/**\n * A Lit ReactiveController that tracks all currently held key names to their physical `event.code` values.\n *\n * Subscribes to the global KeyStateTracker and triggers host updates\n * whenever keys are pressed or released.\n *\n * @example\n * ```ts\n * class KeyDisplay extends LitElement {\n *   private heldKeyCodes = new HeldKeyCodesController(this)\n *\n *   render() {\n *     const heldCodes = Object.entries(this.heldKeyCodes.value).map(([key, code]) => `${key}: ${code}`).join(' + ')\n *     return html`\n *       <div>\n *         Currently pressed: ${heldCodes || 'None'}\n *       </div>\n *     `\n *   }\n * }\n * ```\n */\nexport class HeldKeyCodesController implements ReactiveController {\n  /** The unsubscribe function to unsubscribe from the tracker store. */\n  private _unsubscribe: (() => void) | undefined\n  /** The currently held key names to their physical `event.code` values. */\n  private _value: Record<string, string> = {}\n\n  /** Map of currently held key names to their physical `event.code` values. */\n  public get value(): Record<string, string> {\n    return this._value\n  }\n\n  /**\n   * @param _host - The Lit component that owns this controller.\n   */\n  constructor(private _host: ReactiveControllerHost) {\n    this._host.addController(this)\n  }\n\n  /** Subscribes to the tracker store and updates the internal state when changes occur. */\n  public hostConnected(): void {\n    const tracker: KeyStateTracker = getKeyStateTracker()\n    this._value = tracker.store.state.heldCodes\n    this._host.requestUpdate()\n\n    const subscription = tracker.store.subscribe(() => {\n      const { heldCodes } = tracker.store.state\n\n      this._value = heldCodes\n      this._host.requestUpdate()\n    })\n\n    this._unsubscribe = () => subscription.unsubscribe()\n  }\n\n  /** Unsubscribes from the tracker store and stops tracking the held key codes. */\n  public hostDisconnected(): void {\n    this._unsubscribe?.()\n    this._unsubscribe = undefined\n    this._value = {}\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,IAAa,yBAAb,MAAkE;;CAOhE,IAAW,QAAgC;AACzC,SAAO,KAAK;;;;;CAMd,YAAY,AAAQ,OAA+B;EAA/B;gBAVqB,EAAE;AAWzC,OAAK,MAAM,cAAc,KAAK;;;CAIhC,AAAO,gBAAsB;EAC3B,MAAM,UAA2B,oBAAoB;AACrD,OAAK,SAAS,QAAQ,MAAM,MAAM;AAClC,OAAK,MAAM,eAAe;EAE1B,MAAM,eAAe,QAAQ,MAAM,gBAAgB;GACjD,MAAM,EAAE,cAAc,QAAQ,MAAM;AAEpC,QAAK,SAAS;AACd,QAAK,MAAM,eAAe;IAC1B;AAEF,OAAK,qBAAqB,aAAa,aAAa;;;CAItD,AAAO,mBAAyB;AAC9B,OAAK,gBAAgB;AACrB,OAAK,eAAe;AACpB,OAAK,SAAS,EAAE"}

package/dist/controllers/held-keys.cjs

@@ -0,0 +1,58 @@
+let _tanstack_hotkeys = require("@tanstack/hotkeys");
+
+//#region src/controllers/held-keys.ts
+/**
+* A Lit ReactiveController that tracks all currently held keyboard keys.
+*
+* Subscribes to the global KeyStateTracker and triggers host updates
+* whenever keys are pressed or released.
+*
+* @example
+* ```ts
+* class KeyDisplay extends LitElement {
+*   private heldKeys = new HeldKeysController(this)
+*
+*   render() {
+*     return html`
+*       <div>
+*         Currently pressed: ${this.heldKeys.value.join(' + ') || 'None'}
+*       </div>
+*     `
+*   }
+* }
+* ```
+*/
+var HeldKeysController = class {
+	/** Array of currently held key names. */
+	get value() {
+		return this._value;
+	}
+	/**
+	* @param _host - The Lit component that owns this controller.
+	*/
+	constructor(_host) {
+		this._host = _host;
+		this._value = [];
+		this._host.addController(this);
+	}
+	/** Subscribes to the tracker store and updates the internal state when changes occur. */
+	hostConnected() {
+		const tracker = (0, _tanstack_hotkeys.getKeyStateTracker)();
+		const subscription = tracker.store.subscribe(() => {
+			const { heldKeys } = tracker.store.state;
+			this._value = heldKeys;
+			this._host.requestUpdate();
+		});
+		this._unsubscribe = () => subscription.unsubscribe();
+	}
+	/** Unsubscribes from the tracker store and stops tracking the held keys. */
+	hostDisconnected() {
+		this._unsubscribe?.();
+		this._unsubscribe = void 0;
+		this._value = [];
+	}
+};
+
+//#endregion
+exports.HeldKeysController = HeldKeysController;
+//# sourceMappingURL=held-keys.cjs.map

package/dist/controllers/held-keys.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"held-keys.cjs","names":[],"sources":["../../src/controllers/held-keys.ts"],"sourcesContent":["import { getKeyStateTracker } from '@tanstack/hotkeys'\nimport type { KeyStateTracker } from '@tanstack/hotkeys'\nimport type { ReactiveController, ReactiveControllerHost } from 'lit'\n\n/**\n * A Lit ReactiveController that tracks all currently held keyboard keys.\n *\n * Subscribes to the global KeyStateTracker and triggers host updates\n * whenever keys are pressed or released.\n *\n * @example\n * ```ts\n * class KeyDisplay extends LitElement {\n *   private heldKeys = new HeldKeysController(this)\n *\n *   render() {\n *     return html`\n *       <div>\n *         Currently pressed: ${this.heldKeys.value.join(' + ') || 'None'}\n *       </div>\n *     `\n *   }\n * }\n * ```\n */\nexport class HeldKeysController implements ReactiveController {\n  /** The unsubscribe function to unsubscribe from the tracker store. */\n  private _unsubscribe: (() => void) | undefined\n  /** The currently held key names. */\n  private _value: Array<string> = []\n\n  /** Array of currently held key names. */\n  public get value(): Array<string> {\n    return this._value\n  }\n\n  /**\n   * @param _host - The Lit component that owns this controller.\n   */\n  constructor(private _host: ReactiveControllerHost) {\n    this._host.addController(this)\n  }\n\n  /** Subscribes to the tracker store and updates the internal state when changes occur. */\n  public hostConnected(): void {\n    const tracker: KeyStateTracker = getKeyStateTracker()\n\n    const subscription = tracker.store.subscribe(() => {\n      const { heldKeys } = tracker.store.state\n\n      this._value = heldKeys\n      this._host.requestUpdate()\n    })\n\n    this._unsubscribe = () => subscription.unsubscribe()\n  }\n\n  /** Unsubscribes from the tracker store and stops tracking the held keys. */\n  public hostDisconnected(): void {\n    this._unsubscribe?.()\n    this._unsubscribe = undefined\n    this._value = []\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyBA,IAAa,qBAAb,MAA8D;;CAO5D,IAAW,QAAuB;AAChC,SAAO,KAAK;;;;;CAMd,YAAY,AAAQ,OAA+B;EAA/B;gBAVY,EAAE;AAWhC,OAAK,MAAM,cAAc,KAAK;;;CAIhC,AAAO,gBAAsB;EAC3B,MAAM,qDAA+C;EAErD,MAAM,eAAe,QAAQ,MAAM,gBAAgB;GACjD,MAAM,EAAE,aAAa,QAAQ,MAAM;AAEnC,QAAK,SAAS;AACd,QAAK,MAAM,eAAe;IAC1B;AAEF,OAAK,qBAAqB,aAAa,aAAa;;;CAItD,AAAO,mBAAyB;AAC9B,OAAK,gBAAgB;AACrB,OAAK,eAAe;AACpB,OAAK,SAAS,EAAE"}

package/dist/controllers/held-keys.d.cts

@@ -0,0 +1,44 @@
+import { ReactiveController, ReactiveControllerHost } from "lit";
+
+//#region src/controllers/held-keys.d.ts
+/**
+ * A Lit ReactiveController that tracks all currently held keyboard keys.
+ *
+ * Subscribes to the global KeyStateTracker and triggers host updates
+ * whenever keys are pressed or released.
+ *
+ * @example
+ * ```ts
+ * class KeyDisplay extends LitElement {
+ *   private heldKeys = new HeldKeysController(this)
+ *
+ *   render() {
+ *     return html`
+ *       <div>
+ *         Currently pressed: ${this.heldKeys.value.join(' + ') || 'None'}
+ *       </div>
+ *     `
+ *   }
+ * }
+ * ```
+ */
+declare class HeldKeysController implements ReactiveController {
+  private _host;
+  /** The unsubscribe function to unsubscribe from the tracker store. */
+  private _unsubscribe;
+  /** The currently held key names. */
+  private _value;
+  /** Array of currently held key names. */
+  get value(): Array<string>;
+  /**
+   * @param _host - The Lit component that owns this controller.
+   */
+  constructor(_host: ReactiveControllerHost);
+  /** Subscribes to the tracker store and updates the internal state when changes occur. */
+  hostConnected(): void;
+  /** Unsubscribes from the tracker store and stops tracking the held keys. */
+  hostDisconnected(): void;
+}
+//#endregion
+export { HeldKeysController };
+//# sourceMappingURL=held-keys.d.cts.map

package/dist/controllers/held-keys.d.ts

@@ -0,0 +1,44 @@
+import { ReactiveController, ReactiveControllerHost } from "lit";
+
+//#region src/controllers/held-keys.d.ts
+/**
+ * A Lit ReactiveController that tracks all currently held keyboard keys.
+ *
+ * Subscribes to the global KeyStateTracker and triggers host updates
+ * whenever keys are pressed or released.
+ *
+ * @example
+ * ```ts
+ * class KeyDisplay extends LitElement {
+ *   private heldKeys = new HeldKeysController(this)
+ *
+ *   render() {
+ *     return html`
+ *       <div>
+ *         Currently pressed: ${this.heldKeys.value.join(' + ') || 'None'}
+ *       </div>
+ *     `
+ *   }
+ * }
+ * ```
+ */
+declare class HeldKeysController implements ReactiveController {
+  private _host;
+  /** The unsubscribe function to unsubscribe from the tracker store. */
+  private _unsubscribe;
+  /** The currently held key names. */
+  private _value;
+  /** Array of currently held key names. */
+  get value(): Array<string>;
+  /**
+   * @param _host - The Lit component that owns this controller.
+   */
+  constructor(_host: ReactiveControllerHost);
+  /** Subscribes to the tracker store and updates the internal state when changes occur. */
+  hostConnected(): void;
+  /** Unsubscribes from the tracker store and stops tracking the held keys. */
+  hostDisconnected(): void;
+}
+//#endregion
+export { HeldKeysController };
+//# sourceMappingURL=held-keys.d.ts.map

package/dist/controllers/held-keys.js

@@ -0,0 +1,58 @@
+import { getKeyStateTracker } from "@tanstack/hotkeys";
+
+//#region src/controllers/held-keys.ts
+/**
+* A Lit ReactiveController that tracks all currently held keyboard keys.
+*
+* Subscribes to the global KeyStateTracker and triggers host updates
+* whenever keys are pressed or released.
+*
+* @example
+* ```ts
+* class KeyDisplay extends LitElement {
+*   private heldKeys = new HeldKeysController(this)
+*
+*   render() {
+*     return html`
+*       <div>
+*         Currently pressed: ${this.heldKeys.value.join(' + ') || 'None'}
+*       </div>
+*     `
+*   }
+* }
+* ```
+*/
+var HeldKeysController = class {
+	/** Array of currently held key names. */
+	get value() {
+		return this._value;
+	}
+	/**
+	* @param _host - The Lit component that owns this controller.
+	*/
+	constructor(_host) {
+		this._host = _host;
+		this._value = [];
+		this._host.addController(this);
+	}
+	/** Subscribes to the tracker store and updates the internal state when changes occur. */
+	hostConnected() {
+		const tracker = getKeyStateTracker();
+		const subscription = tracker.store.subscribe(() => {
+			const { heldKeys } = tracker.store.state;
+			this._value = heldKeys;
+			this._host.requestUpdate();
+		});
+		this._unsubscribe = () => subscription.unsubscribe();
+	}
+	/** Unsubscribes from the tracker store and stops tracking the held keys. */
+	hostDisconnected() {
+		this._unsubscribe?.();
+		this._unsubscribe = void 0;
+		this._value = [];
+	}
+};
+
+//#endregion
+export { HeldKeysController };
+//# sourceMappingURL=held-keys.js.map

package/dist/controllers/held-keys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"held-keys.js","names":[],"sources":["../../src/controllers/held-keys.ts"],"sourcesContent":["import { getKeyStateTracker } from '@tanstack/hotkeys'\nimport type { KeyStateTracker } from '@tanstack/hotkeys'\nimport type { ReactiveController, ReactiveControllerHost } from 'lit'\n\n/**\n * A Lit ReactiveController that tracks all currently held keyboard keys.\n *\n * Subscribes to the global KeyStateTracker and triggers host updates\n * whenever keys are pressed or released.\n *\n * @example\n * ```ts\n * class KeyDisplay extends LitElement {\n *   private heldKeys = new HeldKeysController(this)\n *\n *   render() {\n *     return html`\n *       <div>\n *         Currently pressed: ${this.heldKeys.value.join(' + ') || 'None'}\n *       </div>\n *     `\n *   }\n * }\n * ```\n */\nexport class HeldKeysController implements ReactiveController {\n  /** The unsubscribe function to unsubscribe from the tracker store. */\n  private _unsubscribe: (() => void) | undefined\n  /** The currently held key names. */\n  private _value: Array<string> = []\n\n  /** Array of currently held key names. */\n  public get value(): Array<string> {\n    return this._value\n  }\n\n  /**\n   * @param _host - The Lit component that owns this controller.\n   */\n  constructor(private _host: ReactiveControllerHost) {\n    this._host.addController(this)\n  }\n\n  /** Subscribes to the tracker store and updates the internal state when changes occur. */\n  public hostConnected(): void {\n    const tracker: KeyStateTracker = getKeyStateTracker()\n\n    const subscription = tracker.store.subscribe(() => {\n      const { heldKeys } = tracker.store.state\n\n      this._value = heldKeys\n      this._host.requestUpdate()\n    })\n\n    this._unsubscribe = () => subscription.unsubscribe()\n  }\n\n  /** Unsubscribes from the tracker store and stops tracking the held keys. */\n  public hostDisconnected(): void {\n    this._unsubscribe?.()\n    this._unsubscribe = undefined\n    this._value = []\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyBA,IAAa,qBAAb,MAA8D;;CAO5D,IAAW,QAAuB;AAChC,SAAO,KAAK;;;;;CAMd,YAAY,AAAQ,OAA+B;EAA/B;gBAVY,EAAE;AAWhC,OAAK,MAAM,cAAc,KAAK;;;CAIhC,AAAO,gBAAsB;EAC3B,MAAM,UAA2B,oBAAoB;EAErD,MAAM,eAAe,QAAQ,MAAM,gBAAgB;GACjD,MAAM,EAAE,aAAa,QAAQ,MAAM;AAEnC,QAAK,SAAS;AACd,QAAK,MAAM,eAAe;IAC1B;AAEF,OAAK,qBAAqB,aAAa,aAAa;;;CAItD,AAAO,mBAAyB;AAC9B,OAAK,gBAAgB;AACrB,OAAK,eAAe;AACpB,OAAK,SAAS,EAAE"}