@tanstack/solid-hotkeys 0.0.1

package/dist/createHeldKeys.d.ts

@@ -0,0 +1,27 @@
+//#region src/createHeldKeys.d.ts
+/**
+ * SolidJS primitive that returns a signal of currently held keyboard keys.
+ *
+ * This primitive uses `useStore` from `@tanstack/solid-store` to subscribe
+ * to the global KeyStateTracker and updates whenever keys are pressed
+ * or released.
+ *
+ * @returns Signal accessor for array of currently held key names
+ *
+ * @example
+ * ```tsx
+ * function KeyDisplay() {
+ *   const heldKeys = createHeldKeys()
+ *
+ *   return (
+ *     <div>
+ *       Currently pressed: {heldKeys().join(' + ') || 'None'}
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+declare function createHeldKeys(): () => Array<string>;
+//#endregion
+export { createHeldKeys };
+//# sourceMappingURL=createHeldKeys.d.ts.map

package/dist/createHeldKeys.js

@@ -0,0 +1,33 @@
+import { getKeyStateTracker } from "@tanstack/hotkeys";
+import { useStore } from "@tanstack/solid-store";
+
+//#region src/createHeldKeys.ts
+/**
+* SolidJS primitive that returns a signal of currently held keyboard keys.
+*
+* This primitive uses `useStore` from `@tanstack/solid-store` to subscribe
+* to the global KeyStateTracker and updates whenever keys are pressed
+* or released.
+*
+* @returns Signal accessor for array of currently held key names
+*
+* @example
+* ```tsx
+* function KeyDisplay() {
+*   const heldKeys = createHeldKeys()
+*
+*   return (
+*     <div>
+*       Currently pressed: {heldKeys().join(' + ') || 'None'}
+*     </div>
+*   )
+* }
+* ```
+*/
+function createHeldKeys() {
+	return useStore(getKeyStateTracker().store, (state) => state.heldKeys);
+}
+
+//#endregion
+export { createHeldKeys };
+//# sourceMappingURL=createHeldKeys.js.map

package/dist/createHeldKeys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createHeldKeys.js","names":[],"sources":["../src/createHeldKeys.ts"],"sourcesContent":["import { useStore } from '@tanstack/solid-store'\nimport { getKeyStateTracker } from '@tanstack/hotkeys'\n\n/**\n * SolidJS primitive that returns a signal of currently held keyboard keys.\n *\n * This primitive uses `useStore` from `@tanstack/solid-store` to subscribe\n * to the global KeyStateTracker and updates whenever keys are pressed\n * or released.\n *\n * @returns Signal accessor for array of currently held key names\n *\n * @example\n * ```tsx\n * function KeyDisplay() {\n *   const heldKeys = createHeldKeys()\n *\n *   return (\n *     <div>\n *       Currently pressed: {heldKeys().join(' + ') || 'None'}\n *     </div>\n *   )\n * }\n * ```\n */\nexport function createHeldKeys(): () => Array<string> {\n  const tracker = getKeyStateTracker()\n  return useStore(tracker.store, (state) => state.heldKeys)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,SAAgB,iBAAsC;AAEpD,QAAO,SADS,oBAAoB,CACZ,QAAQ,UAAU,MAAM,SAAS"}

package/dist/createHotkey.cjs

@@ -0,0 +1,100 @@
+const require_HotkeysProvider = require('./HotkeysProvider.cjs');
+let _tanstack_hotkeys = require("@tanstack/hotkeys");
+let solid_js = require("solid-js");
+
+//#region src/createHotkey.ts
+/**
+* SolidJS primitive for registering a keyboard hotkey.
+*
+* Uses the singleton HotkeyManager for efficient event handling.
+* The callback receives both the keyboard event and a context object
+* containing the hotkey string and parsed hotkey.
+*
+* This primitive automatically tracks reactive dependencies and updates
+* the registration when options or the callback change.
+*
+* @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)
+* @param callback - The function to call when the hotkey is pressed
+* @param options - Options for the hotkey behavior
+*
+* @example
+* ```tsx
+* function SaveButton() {
+*   const [count, setCount] = createSignal(0)
+*
+*   // Callback always has access to latest count value
+*   createHotkey('Mod+S', (event, { hotkey }) => {
+*     console.log(`Save triggered, count is ${count()}`)
+*     handleSave()
+*   })
+*
+*   return <button onClick={() => setCount(c => c + 1)}>Count: {count()}</button>
+* }
+* ```
+*
+* @example
+* ```tsx
+* function Modal(props) {
+*   // enabled option is reactive
+*   createHotkey('Escape', () => {
+*     props.onClose()
+*   }, () => ({ enabled: props.isOpen }))
+*
+*   return <Show when={props.isOpen}>
+*     <div class="modal">...</div>
+*   </Show>
+* }
+* ```
+*
+* @example
+* ```tsx
+* function Editor() {
+*   const [editorRef, setEditorRef] = createSignal<HTMLDivElement | null>(null)
+*
+*   // Scoped to a specific element - use accessor so hotkey waits for ref
+*   createHotkey('Mod+S', save, () => ({ target: editorRef() }))
+*
+*   return <div ref={setEditorRef}>...</div>
+* }
+* ```
+*/
+function createHotkey(hotkey, callback, options = {}) {
+	const defaultOptions = require_HotkeysProvider.useDefaultHotkeysOptions();
+	const manager = (0, _tanstack_hotkeys.getHotkeyManager)();
+	let registration = null;
+	(0, solid_js.createEffect)(() => {
+		const resolvedHotkey = typeof hotkey === "function" ? hotkey() : hotkey;
+		const resolvedOptions = typeof options === "function" ? options() : options;
+		const mergedOptions = {
+			...defaultOptions.hotkey,
+			...resolvedOptions
+		};
+		const platform = mergedOptions.platform ?? (0, _tanstack_hotkeys.detectPlatform)();
+		const hotkeyString = typeof resolvedHotkey === "string" ? resolvedHotkey : (0, _tanstack_hotkeys.formatHotkey)((0, _tanstack_hotkeys.rawHotkeyToParsedHotkey)(resolvedHotkey, platform));
+		const resolvedTarget = "target" in mergedOptions ? mergedOptions.target ?? null : typeof document !== "undefined" ? document : null;
+		if (!resolvedTarget) return;
+		if (registration?.isActive) {
+			registration.unregister();
+			registration = null;
+		}
+		const { target: _target, ...optionsWithoutTarget } = mergedOptions;
+		registration = manager.register(hotkeyString, callback, {
+			...optionsWithoutTarget,
+			target: resolvedTarget
+		});
+		if (registration.isActive) {
+			registration.callback = callback;
+			registration.setOptions(optionsWithoutTarget);
+		}
+		(0, solid_js.onCleanup)(() => {
+			if (registration?.isActive) {
+				registration.unregister();
+				registration = null;
+			}
+		});
+	});
+}
+
+//#endregion
+exports.createHotkey = createHotkey;
+//# sourceMappingURL=createHotkey.cjs.map

package/dist/createHotkey.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"createHotkey.cjs","names":["useDefaultHotkeysOptions"],"sources":["../src/createHotkey.ts"],"sourcesContent":["import { createEffect, onCleanup } from 'solid-js'\nimport {\n  detectPlatform,\n  formatHotkey,\n  getHotkeyManager,\n  rawHotkeyToParsedHotkey,\n} from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProvider'\nimport type {\n  Hotkey,\n  HotkeyCallback,\n  HotkeyOptions,\n  HotkeyRegistrationHandle,\n  RegisterableHotkey,\n} from '@tanstack/hotkeys'\n\nexport interface CreateHotkeyOptions extends Omit<HotkeyOptions, 'target'> {\n  /**\n   * The DOM element to attach the event listener to.\n   * Can be a direct DOM element, an accessor (for reactive targets that become\n   * available after mount), or null. Defaults to document.\n   * When using scoped targets, pass an accessor: () => ({ target: elementSignal() })\n   * so the hotkey waits for the element to be attached before registering.\n   */\n  target?: HTMLElement | Document | Window | null\n}\n\n/**\n * SolidJS primitive for registering a keyboard hotkey.\n *\n * Uses the singleton HotkeyManager for efficient event handling.\n * The callback receives both the keyboard event and a context object\n * containing the hotkey string and parsed hotkey.\n *\n * This primitive automatically tracks reactive dependencies and updates\n * the registration when options or the callback change.\n *\n * @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)\n * @param callback - The function to call when the hotkey is pressed\n * @param options - Options for the hotkey behavior\n *\n * @example\n * ```tsx\n * function SaveButton() {\n *   const [count, setCount] = createSignal(0)\n *\n *   // Callback always has access to latest count value\n *   createHotkey('Mod+S', (event, { hotkey }) => {\n *     console.log(`Save triggered, count is ${count()}`)\n *     handleSave()\n *   })\n *\n *   return <button onClick={() => setCount(c => c + 1)}>Count: {count()}</button>\n * }\n * ```\n *\n * @example\n * ```tsx\n * function Modal(props) {\n *   // enabled option is reactive\n *   createHotkey('Escape', () => {\n *     props.onClose()\n *   }, () => ({ enabled: props.isOpen }))\n *\n *   return <Show when={props.isOpen}>\n *     <div class=\"modal\">...</div>\n *   </Show>\n * }\n * ```\n *\n * @example\n * ```tsx\n * function Editor() {\n *   const [editorRef, setEditorRef] = createSignal<HTMLDivElement | null>(null)\n *\n *   // Scoped to a specific element - use accessor so hotkey waits for ref\n *   createHotkey('Mod+S', save, () => ({ target: editorRef() }))\n *\n *   return <div ref={setEditorRef}>...</div>\n * }\n * ```\n */\nexport function createHotkey(\n  hotkey: RegisterableHotkey | (() => RegisterableHotkey),\n  callback: HotkeyCallback,\n  options: CreateHotkeyOptions | (() => CreateHotkeyOptions) = {},\n): void {\n  const defaultOptions = useDefaultHotkeysOptions()\n  const manager = getHotkeyManager()\n\n  let registration: HotkeyRegistrationHandle | null = null\n\n  createEffect(() => {\n    // Resolve reactive values\n    const resolvedHotkey = typeof hotkey === 'function' ? hotkey() : hotkey\n    const resolvedOptions = typeof options === 'function' ? options() : options\n\n    const mergedOptions = {\n      ...defaultOptions.hotkey,\n      ...resolvedOptions,\n    } as CreateHotkeyOptions\n\n    // Normalize to hotkey string\n    const platform = mergedOptions.platform ?? detectPlatform()\n    const hotkeyString: Hotkey =\n      typeof resolvedHotkey === 'string'\n        ? resolvedHotkey\n        : (formatHotkey(\n            rawHotkeyToParsedHotkey(resolvedHotkey, platform),\n          ) as Hotkey)\n\n    // Resolve target: when explicitly provided (even as null), use it and skip if null.\n    // When not provided, default to document. Matches React's ref handling.\n    const resolvedTarget =\n      'target' in mergedOptions\n        ? (mergedOptions.target ?? null)\n        : typeof document !== 'undefined'\n          ? document\n          : null\n\n    if (!resolvedTarget) {\n      return\n    }\n\n    // Unregister previous registration if it exists\n    if (registration?.isActive) {\n      registration.unregister()\n      registration = null\n    }\n\n    // Extract options without target (target is handled separately)\n    const { target: _target, ...optionsWithoutTarget } = mergedOptions\n\n    // Register the hotkey\n    registration = manager.register(hotkeyString, callback, {\n      ...optionsWithoutTarget,\n      target: resolvedTarget,\n    })\n\n    // Update callback and options on every effect run\n    if (registration.isActive) {\n      registration.callback = callback\n      registration.setOptions(optionsWithoutTarget)\n    }\n\n    // Cleanup on disposal\n    onCleanup(() => {\n      if (registration?.isActive) {\n        registration.unregister()\n        registration = null\n      }\n    })\n  })\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkFA,SAAgB,aACd,QACA,UACA,UAA6D,EAAE,EACzD;CACN,MAAM,iBAAiBA,kDAA0B;CACjD,MAAM,mDAA4B;CAElC,IAAI,eAAgD;AAEpD,kCAAmB;EAEjB,MAAM,iBAAiB,OAAO,WAAW,aAAa,QAAQ,GAAG;EACjE,MAAM,kBAAkB,OAAO,YAAY,aAAa,SAAS,GAAG;EAEpE,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;EAGD,MAAM,WAAW,cAAc,mDAA4B;EAC3D,MAAM,eACJ,OAAO,mBAAmB,WACtB,oGAE0B,gBAAgB,SAAS,CAClD;EAIP,MAAM,iBACJ,YAAY,gBACP,cAAc,UAAU,OACzB,OAAO,aAAa,cAClB,WACA;AAER,MAAI,CAAC,eACH;AAIF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;EAIjB,MAAM,EAAE,QAAQ,SAAS,GAAG,yBAAyB;AAGrD,iBAAe,QAAQ,SAAS,cAAc,UAAU;GACtD,GAAG;GACH,QAAQ;GACT,CAAC;AAGF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;AAI/C,gCAAgB;AACd,OAAI,cAAc,UAAU;AAC1B,iBAAa,YAAY;AACzB,mBAAe;;IAEjB;GACF"}

package/dist/createHotkey.d.cts

@@ -0,0 +1,72 @@
+import { HotkeyCallback, HotkeyOptions, RegisterableHotkey } from "@tanstack/hotkeys";
+
+//#region src/createHotkey.d.ts
+interface CreateHotkeyOptions extends Omit<HotkeyOptions, 'target'> {
+  /**
+   * The DOM element to attach the event listener to.
+   * Can be a direct DOM element, an accessor (for reactive targets that become
+   * available after mount), or null. Defaults to document.
+   * When using scoped targets, pass an accessor: () => ({ target: elementSignal() })
+   * so the hotkey waits for the element to be attached before registering.
+   */
+  target?: HTMLElement | Document | Window | null;
+}
+/**
+ * SolidJS primitive for registering a keyboard hotkey.
+ *
+ * Uses the singleton HotkeyManager for efficient event handling.
+ * The callback receives both the keyboard event and a context object
+ * containing the hotkey string and parsed hotkey.
+ *
+ * This primitive automatically tracks reactive dependencies and updates
+ * the registration when options or the callback change.
+ *
+ * @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)
+ * @param callback - The function to call when the hotkey is pressed
+ * @param options - Options for the hotkey behavior
+ *
+ * @example
+ * ```tsx
+ * function SaveButton() {
+ *   const [count, setCount] = createSignal(0)
+ *
+ *   // Callback always has access to latest count value
+ *   createHotkey('Mod+S', (event, { hotkey }) => {
+ *     console.log(`Save triggered, count is ${count()}`)
+ *     handleSave()
+ *   })
+ *
+ *   return <button onClick={() => setCount(c => c + 1)}>Count: {count()}</button>
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function Modal(props) {
+ *   // enabled option is reactive
+ *   createHotkey('Escape', () => {
+ *     props.onClose()
+ *   }, () => ({ enabled: props.isOpen }))
+ *
+ *   return <Show when={props.isOpen}>
+ *     <div class="modal">...</div>
+ *   </Show>
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function Editor() {
+ *   const [editorRef, setEditorRef] = createSignal<HTMLDivElement | null>(null)
+ *
+ *   // Scoped to a specific element - use accessor so hotkey waits for ref
+ *   createHotkey('Mod+S', save, () => ({ target: editorRef() }))
+ *
+ *   return <div ref={setEditorRef}>...</div>
+ * }
+ * ```
+ */
+declare function createHotkey(hotkey: RegisterableHotkey | (() => RegisterableHotkey), callback: HotkeyCallback, options?: CreateHotkeyOptions | (() => CreateHotkeyOptions)): void;
+//#endregion
+export { CreateHotkeyOptions, createHotkey };
+//# sourceMappingURL=createHotkey.d.cts.map

package/dist/createHotkey.d.ts

@@ -0,0 +1,72 @@
+import { HotkeyCallback, HotkeyOptions, RegisterableHotkey } from "@tanstack/hotkeys";
+
+//#region src/createHotkey.d.ts
+interface CreateHotkeyOptions extends Omit<HotkeyOptions, 'target'> {
+  /**
+   * The DOM element to attach the event listener to.
+   * Can be a direct DOM element, an accessor (for reactive targets that become
+   * available after mount), or null. Defaults to document.
+   * When using scoped targets, pass an accessor: () => ({ target: elementSignal() })
+   * so the hotkey waits for the element to be attached before registering.
+   */
+  target?: HTMLElement | Document | Window | null;
+}
+/**
+ * SolidJS primitive for registering a keyboard hotkey.
+ *
+ * Uses the singleton HotkeyManager for efficient event handling.
+ * The callback receives both the keyboard event and a context object
+ * containing the hotkey string and parsed hotkey.
+ *
+ * This primitive automatically tracks reactive dependencies and updates
+ * the registration when options or the callback change.
+ *
+ * @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)
+ * @param callback - The function to call when the hotkey is pressed
+ * @param options - Options for the hotkey behavior
+ *
+ * @example
+ * ```tsx
+ * function SaveButton() {
+ *   const [count, setCount] = createSignal(0)
+ *
+ *   // Callback always has access to latest count value
+ *   createHotkey('Mod+S', (event, { hotkey }) => {
+ *     console.log(`Save triggered, count is ${count()}`)
+ *     handleSave()
+ *   })
+ *
+ *   return <button onClick={() => setCount(c => c + 1)}>Count: {count()}</button>
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function Modal(props) {
+ *   // enabled option is reactive
+ *   createHotkey('Escape', () => {
+ *     props.onClose()
+ *   }, () => ({ enabled: props.isOpen }))
+ *
+ *   return <Show when={props.isOpen}>
+ *     <div class="modal">...</div>
+ *   </Show>
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function Editor() {
+ *   const [editorRef, setEditorRef] = createSignal<HTMLDivElement | null>(null)
+ *
+ *   // Scoped to a specific element - use accessor so hotkey waits for ref
+ *   createHotkey('Mod+S', save, () => ({ target: editorRef() }))
+ *
+ *   return <div ref={setEditorRef}>...</div>
+ * }
+ * ```
+ */
+declare function createHotkey(hotkey: RegisterableHotkey | (() => RegisterableHotkey), callback: HotkeyCallback, options?: CreateHotkeyOptions | (() => CreateHotkeyOptions)): void;
+//#endregion
+export { CreateHotkeyOptions, createHotkey };
+//# sourceMappingURL=createHotkey.d.ts.map

package/dist/createHotkey.js

@@ -0,0 +1,100 @@
+import { useDefaultHotkeysOptions } from "./HotkeysProvider.js";
+import { detectPlatform, formatHotkey, getHotkeyManager, rawHotkeyToParsedHotkey } from "@tanstack/hotkeys";
+import { createEffect, onCleanup } from "solid-js";
+
+//#region src/createHotkey.ts
+/**
+* SolidJS primitive for registering a keyboard hotkey.
+*
+* Uses the singleton HotkeyManager for efficient event handling.
+* The callback receives both the keyboard event and a context object
+* containing the hotkey string and parsed hotkey.
+*
+* This primitive automatically tracks reactive dependencies and updates
+* the registration when options or the callback change.
+*
+* @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)
+* @param callback - The function to call when the hotkey is pressed
+* @param options - Options for the hotkey behavior
+*
+* @example
+* ```tsx
+* function SaveButton() {
+*   const [count, setCount] = createSignal(0)
+*
+*   // Callback always has access to latest count value
+*   createHotkey('Mod+S', (event, { hotkey }) => {
+*     console.log(`Save triggered, count is ${count()}`)
+*     handleSave()
+*   })
+*
+*   return <button onClick={() => setCount(c => c + 1)}>Count: {count()}</button>
+* }
+* ```
+*
+* @example
+* ```tsx
+* function Modal(props) {
+*   // enabled option is reactive
+*   createHotkey('Escape', () => {
+*     props.onClose()
+*   }, () => ({ enabled: props.isOpen }))
+*
+*   return <Show when={props.isOpen}>
+*     <div class="modal">...</div>
+*   </Show>
+* }
+* ```
+*
+* @example
+* ```tsx
+* function Editor() {
+*   const [editorRef, setEditorRef] = createSignal<HTMLDivElement | null>(null)
+*
+*   // Scoped to a specific element - use accessor so hotkey waits for ref
+*   createHotkey('Mod+S', save, () => ({ target: editorRef() }))
+*
+*   return <div ref={setEditorRef}>...</div>
+* }
+* ```
+*/
+function createHotkey(hotkey, callback, options = {}) {
+	const defaultOptions = useDefaultHotkeysOptions();
+	const manager = getHotkeyManager();
+	let registration = null;
+	createEffect(() => {
+		const resolvedHotkey = typeof hotkey === "function" ? hotkey() : hotkey;
+		const resolvedOptions = typeof options === "function" ? options() : options;
+		const mergedOptions = {
+			...defaultOptions.hotkey,
+			...resolvedOptions
+		};
+		const platform = mergedOptions.platform ?? detectPlatform();
+		const hotkeyString = typeof resolvedHotkey === "string" ? resolvedHotkey : formatHotkey(rawHotkeyToParsedHotkey(resolvedHotkey, platform));
+		const resolvedTarget = "target" in mergedOptions ? mergedOptions.target ?? null : typeof document !== "undefined" ? document : null;
+		if (!resolvedTarget) return;
+		if (registration?.isActive) {
+			registration.unregister();
+			registration = null;
+		}
+		const { target: _target, ...optionsWithoutTarget } = mergedOptions;
+		registration = manager.register(hotkeyString, callback, {
+			...optionsWithoutTarget,
+			target: resolvedTarget
+		});
+		if (registration.isActive) {
+			registration.callback = callback;
+			registration.setOptions(optionsWithoutTarget);
+		}
+		onCleanup(() => {
+			if (registration?.isActive) {
+				registration.unregister();
+				registration = null;
+			}
+		});
+	});
+}
+
+//#endregion
+export { createHotkey };
+//# sourceMappingURL=createHotkey.js.map

package/dist/createHotkey.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createHotkey.js","names":[],"sources":["../src/createHotkey.ts"],"sourcesContent":["import { createEffect, onCleanup } from 'solid-js'\nimport {\n  detectPlatform,\n  formatHotkey,\n  getHotkeyManager,\n  rawHotkeyToParsedHotkey,\n} from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProvider'\nimport type {\n  Hotkey,\n  HotkeyCallback,\n  HotkeyOptions,\n  HotkeyRegistrationHandle,\n  RegisterableHotkey,\n} from '@tanstack/hotkeys'\n\nexport interface CreateHotkeyOptions extends Omit<HotkeyOptions, 'target'> {\n  /**\n   * The DOM element to attach the event listener to.\n   * Can be a direct DOM element, an accessor (for reactive targets that become\n   * available after mount), or null. Defaults to document.\n   * When using scoped targets, pass an accessor: () => ({ target: elementSignal() })\n   * so the hotkey waits for the element to be attached before registering.\n   */\n  target?: HTMLElement | Document | Window | null\n}\n\n/**\n * SolidJS primitive for registering a keyboard hotkey.\n *\n * Uses the singleton HotkeyManager for efficient event handling.\n * The callback receives both the keyboard event and a context object\n * containing the hotkey string and parsed hotkey.\n *\n * This primitive automatically tracks reactive dependencies and updates\n * the registration when options or the callback change.\n *\n * @param hotkey - The hotkey string (e.g., 'Mod+S', 'Escape') or RawHotkey object (supports `mod` for cross-platform)\n * @param callback - The function to call when the hotkey is pressed\n * @param options - Options for the hotkey behavior\n *\n * @example\n * ```tsx\n * function SaveButton() {\n *   const [count, setCount] = createSignal(0)\n *\n *   // Callback always has access to latest count value\n *   createHotkey('Mod+S', (event, { hotkey }) => {\n *     console.log(`Save triggered, count is ${count()}`)\n *     handleSave()\n *   })\n *\n *   return <button onClick={() => setCount(c => c + 1)}>Count: {count()}</button>\n * }\n * ```\n *\n * @example\n * ```tsx\n * function Modal(props) {\n *   // enabled option is reactive\n *   createHotkey('Escape', () => {\n *     props.onClose()\n *   }, () => ({ enabled: props.isOpen }))\n *\n *   return <Show when={props.isOpen}>\n *     <div class=\"modal\">...</div>\n *   </Show>\n * }\n * ```\n *\n * @example\n * ```tsx\n * function Editor() {\n *   const [editorRef, setEditorRef] = createSignal<HTMLDivElement | null>(null)\n *\n *   // Scoped to a specific element - use accessor so hotkey waits for ref\n *   createHotkey('Mod+S', save, () => ({ target: editorRef() }))\n *\n *   return <div ref={setEditorRef}>...</div>\n * }\n * ```\n */\nexport function createHotkey(\n  hotkey: RegisterableHotkey | (() => RegisterableHotkey),\n  callback: HotkeyCallback,\n  options: CreateHotkeyOptions | (() => CreateHotkeyOptions) = {},\n): void {\n  const defaultOptions = useDefaultHotkeysOptions()\n  const manager = getHotkeyManager()\n\n  let registration: HotkeyRegistrationHandle | null = null\n\n  createEffect(() => {\n    // Resolve reactive values\n    const resolvedHotkey = typeof hotkey === 'function' ? hotkey() : hotkey\n    const resolvedOptions = typeof options === 'function' ? options() : options\n\n    const mergedOptions = {\n      ...defaultOptions.hotkey,\n      ...resolvedOptions,\n    } as CreateHotkeyOptions\n\n    // Normalize to hotkey string\n    const platform = mergedOptions.platform ?? detectPlatform()\n    const hotkeyString: Hotkey =\n      typeof resolvedHotkey === 'string'\n        ? resolvedHotkey\n        : (formatHotkey(\n            rawHotkeyToParsedHotkey(resolvedHotkey, platform),\n          ) as Hotkey)\n\n    // Resolve target: when explicitly provided (even as null), use it and skip if null.\n    // When not provided, default to document. Matches React's ref handling.\n    const resolvedTarget =\n      'target' in mergedOptions\n        ? (mergedOptions.target ?? null)\n        : typeof document !== 'undefined'\n          ? document\n          : null\n\n    if (!resolvedTarget) {\n      return\n    }\n\n    // Unregister previous registration if it exists\n    if (registration?.isActive) {\n      registration.unregister()\n      registration = null\n    }\n\n    // Extract options without target (target is handled separately)\n    const { target: _target, ...optionsWithoutTarget } = mergedOptions\n\n    // Register the hotkey\n    registration = manager.register(hotkeyString, callback, {\n      ...optionsWithoutTarget,\n      target: resolvedTarget,\n    })\n\n    // Update callback and options on every effect run\n    if (registration.isActive) {\n      registration.callback = callback\n      registration.setOptions(optionsWithoutTarget)\n    }\n\n    // Cleanup on disposal\n    onCleanup(() => {\n      if (registration?.isActive) {\n        registration.unregister()\n        registration = null\n      }\n    })\n  })\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkFA,SAAgB,aACd,QACA,UACA,UAA6D,EAAE,EACzD;CACN,MAAM,iBAAiB,0BAA0B;CACjD,MAAM,UAAU,kBAAkB;CAElC,IAAI,eAAgD;AAEpD,oBAAmB;EAEjB,MAAM,iBAAiB,OAAO,WAAW,aAAa,QAAQ,GAAG;EACjE,MAAM,kBAAkB,OAAO,YAAY,aAAa,SAAS,GAAG;EAEpE,MAAM,gBAAgB;GACpB,GAAG,eAAe;GAClB,GAAG;GACJ;EAGD,MAAM,WAAW,cAAc,YAAY,gBAAgB;EAC3D,MAAM,eACJ,OAAO,mBAAmB,WACtB,iBACC,aACC,wBAAwB,gBAAgB,SAAS,CAClD;EAIP,MAAM,iBACJ,YAAY,gBACP,cAAc,UAAU,OACzB,OAAO,aAAa,cAClB,WACA;AAER,MAAI,CAAC,eACH;AAIF,MAAI,cAAc,UAAU;AAC1B,gBAAa,YAAY;AACzB,kBAAe;;EAIjB,MAAM,EAAE,QAAQ,SAAS,GAAG,yBAAyB;AAGrD,iBAAe,QAAQ,SAAS,cAAc,UAAU;GACtD,GAAG;GACH,QAAQ;GACT,CAAC;AAGF,MAAI,aAAa,UAAU;AACzB,gBAAa,WAAW;AACxB,gBAAa,WAAW,qBAAqB;;AAI/C,kBAAgB;AACd,OAAI,cAAc,UAAU;AAC1B,iBAAa,YAAY;AACzB,mBAAe;;IAEjB;GACF"}

package/dist/createHotkeyRecorder.cjs

@@ -0,0 +1,78 @@
+const require_HotkeysProvider = require('./HotkeysProvider.cjs');
+let _tanstack_hotkeys = require("@tanstack/hotkeys");
+let solid_js = require("solid-js");
+let _tanstack_solid_store = require("@tanstack/solid-store");
+
+//#region src/createHotkeyRecorder.ts
+/**
+* SolidJS primitive for recording keyboard shortcuts.
+*
+* This primitive provides a thin wrapper around the framework-agnostic `HotkeyRecorder`
+* class, managing all the complexity of capturing keyboard events, converting them
+* to hotkey strings, and handling edge cases like Escape to cancel or Backspace/Delete
+* to clear.
+*
+* This primitive uses `useStore` from `@tanstack/solid-store` to subscribe
+* to the recorder's store state (same pattern as useHotkeyRecorder in React).
+*
+* @param options - Configuration options for the recorder (or accessor function)
+* @returns An object with recording state signals and control functions
+*
+* @example
+* ```tsx
+* function ShortcutSettings() {
+*   const [shortcut, setShortcut] = createSignal<Hotkey>('Mod+S')
+*
+*   const recorder = createHotkeyRecorder({
+*     onRecord: (hotkey) => {
+*       setShortcut(hotkey)
+*     },
+*     onCancel: () => {
+*       console.log('Recording cancelled')
+*     },
+*   })
+*
+*   return (
+*     <div>
+*       <button onClick={recorder.startRecording}>
+*         {recorder.isRecording() ? 'Recording...' : 'Edit Shortcut'}
+*       </button>
+*       <Show when={recorder.recordedHotkey()}>
+*         <div>Recording: {recorder.recordedHotkey()}</div>
+*       </Show>
+*     </div>
+*   )
+* }
+* ```
+*/
+function createHotkeyRecorder(options) {
+	const defaultOptions = require_HotkeysProvider.useDefaultHotkeysOptions();
+	const resolvedOptions = typeof options === "function" ? options() : options;
+	const recorder = new _tanstack_hotkeys.HotkeyRecorder({
+		...defaultOptions.hotkeyRecorder,
+		...resolvedOptions
+	});
+	const isRecording = (0, _tanstack_solid_store.useStore)(recorder.store, (state) => state.isRecording);
+	const recordedHotkey = (0, _tanstack_solid_store.useStore)(recorder.store, (state) => state.recordedHotkey);
+	(0, solid_js.createEffect)(() => {
+		const resolved = typeof options === "function" ? options() : options;
+		recorder.setOptions({
+			...defaultOptions.hotkeyRecorder,
+			...resolved
+		});
+	});
+	(0, solid_js.onCleanup)(() => {
+		recorder.destroy();
+	});
+	return {
+		isRecording,
+		recordedHotkey,
+		startRecording: () => recorder.start(),
+		stopRecording: () => recorder.stop(),
+		cancelRecording: () => recorder.cancel()
+	};
+}
+
+//#endregion
+exports.createHotkeyRecorder = createHotkeyRecorder;
+//# sourceMappingURL=createHotkeyRecorder.cjs.map

package/dist/createHotkeyRecorder.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"createHotkeyRecorder.cjs","names":["useDefaultHotkeysOptions","HotkeyRecorder"],"sources":["../src/createHotkeyRecorder.ts"],"sourcesContent":["import { createEffect, onCleanup } from 'solid-js'\nimport { useStore } from '@tanstack/solid-store'\nimport { HotkeyRecorder } from '@tanstack/hotkeys'\nimport { useDefaultHotkeysOptions } from './HotkeysProvider'\nimport type { Hotkey, HotkeyRecorderOptions } from '@tanstack/hotkeys'\n\nexport interface SolidHotkeyRecorder {\n  /** Whether recording is currently active */\n  isRecording: () => boolean\n  /** The currently recorded hotkey (for live preview) */\n  recordedHotkey: () => Hotkey | null\n  /** Start recording a new hotkey */\n  startRecording: () => void\n  /** Stop recording (same as cancel) */\n  stopRecording: () => void\n  /** Cancel recording without saving */\n  cancelRecording: () => void\n}\n\n/**\n * SolidJS primitive for recording keyboard shortcuts.\n *\n * This primitive provides a thin wrapper around the framework-agnostic `HotkeyRecorder`\n * class, managing all the complexity of capturing keyboard events, converting them\n * to hotkey strings, and handling edge cases like Escape to cancel or Backspace/Delete\n * to clear.\n *\n * This primitive uses `useStore` from `@tanstack/solid-store` to subscribe\n * to the recorder's store state (same pattern as useHotkeyRecorder in React).\n *\n * @param options - Configuration options for the recorder (or accessor function)\n * @returns An object with recording state signals and control functions\n *\n * @example\n * ```tsx\n * function ShortcutSettings() {\n *   const [shortcut, setShortcut] = createSignal<Hotkey>('Mod+S')\n *\n *   const recorder = createHotkeyRecorder({\n *     onRecord: (hotkey) => {\n *       setShortcut(hotkey)\n *     },\n *     onCancel: () => {\n *       console.log('Recording cancelled')\n *     },\n *   })\n *\n *   return (\n *     <div>\n *       <button onClick={recorder.startRecording}>\n *         {recorder.isRecording() ? 'Recording...' : 'Edit Shortcut'}\n *       </button>\n *       <Show when={recorder.recordedHotkey()}>\n *         <div>Recording: {recorder.recordedHotkey()}</div>\n *       </Show>\n *     </div>\n *   )\n * }\n * ```\n */\nexport function createHotkeyRecorder(\n  options: HotkeyRecorderOptions | (() => HotkeyRecorderOptions),\n): SolidHotkeyRecorder {\n  const defaultOptions = useDefaultHotkeysOptions()\n\n  const resolvedOptions = typeof options === 'function' ? options() : options\n  const mergedOptions = {\n    ...defaultOptions.hotkeyRecorder,\n    ...resolvedOptions,\n  } as HotkeyRecorderOptions\n\n  // Create recorder once synchronously (matches React's useRef pattern)\n  const recorder = new HotkeyRecorder(mergedOptions)\n\n  // Subscribe to recorder state using useStore (same pattern as useHotkeyRecorder)\n  const isRecording = useStore(recorder.store, (state) => state.isRecording)\n  const recordedHotkey = useStore(\n    recorder.store,\n    (state) => state.recordedHotkey,\n  )\n\n  // Sync options on every effect run (matches React's sync on render)\n  createEffect(() => {\n    const resolved = typeof options === 'function' ? options() : options\n    recorder.setOptions({\n      ...defaultOptions.hotkeyRecorder,\n      ...resolved,\n    } as HotkeyRecorderOptions)\n  })\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    recorder.destroy()\n  })\n\n  return {\n    isRecording,\n    recordedHotkey,\n    startRecording: () => recorder.start(),\n    stopRecording: () => recorder.stop(),\n    cancelRecording: () => recorder.cancel(),\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DA,SAAgB,qBACd,SACqB;CACrB,MAAM,iBAAiBA,kDAA0B;CAEjD,MAAM,kBAAkB,OAAO,YAAY,aAAa,SAAS,GAAG;CAOpE,MAAM,WAAW,IAAIC,iCANC;EACpB,GAAG,eAAe;EAClB,GAAG;EACJ,CAGiD;CAGlD,MAAM,kDAAuB,SAAS,QAAQ,UAAU,MAAM,YAAY;CAC1E,MAAM,qDACJ,SAAS,QACR,UAAU,MAAM,eAClB;AAGD,kCAAmB;EACjB,MAAM,WAAW,OAAO,YAAY,aAAa,SAAS,GAAG;AAC7D,WAAS,WAAW;GAClB,GAAG,eAAe;GAClB,GAAG;GACJ,CAA0B;GAC3B;AAGF,+BAAgB;AACd,WAAS,SAAS;GAClB;AAEF,QAAO;EACL;EACA;EACA,sBAAsB,SAAS,OAAO;EACtC,qBAAqB,SAAS,MAAM;EACpC,uBAAuB,SAAS,QAAQ;EACzC"}

package/dist/createHotkeyRecorder.d.cts

@@ -0,0 +1,60 @@
+import { Hotkey, HotkeyRecorderOptions } from "@tanstack/hotkeys";
+
+//#region src/createHotkeyRecorder.d.ts
+interface SolidHotkeyRecorder {
+  /** Whether recording is currently active */
+  isRecording: () => boolean;
+  /** The currently recorded hotkey (for live preview) */
+  recordedHotkey: () => Hotkey | null;
+  /** Start recording a new hotkey */
+  startRecording: () => void;
+  /** Stop recording (same as cancel) */
+  stopRecording: () => void;
+  /** Cancel recording without saving */
+  cancelRecording: () => void;
+}
+/**
+ * SolidJS primitive for recording keyboard shortcuts.
+ *
+ * This primitive provides a thin wrapper around the framework-agnostic `HotkeyRecorder`
+ * class, managing all the complexity of capturing keyboard events, converting them
+ * to hotkey strings, and handling edge cases like Escape to cancel or Backspace/Delete
+ * to clear.
+ *
+ * This primitive uses `useStore` from `@tanstack/solid-store` to subscribe
+ * to the recorder's store state (same pattern as useHotkeyRecorder in React).
+ *
+ * @param options - Configuration options for the recorder (or accessor function)
+ * @returns An object with recording state signals and control functions
+ *
+ * @example
+ * ```tsx
+ * function ShortcutSettings() {
+ *   const [shortcut, setShortcut] = createSignal<Hotkey>('Mod+S')
+ *
+ *   const recorder = createHotkeyRecorder({
+ *     onRecord: (hotkey) => {
+ *       setShortcut(hotkey)
+ *     },
+ *     onCancel: () => {
+ *       console.log('Recording cancelled')
+ *     },
+ *   })
+ *
+ *   return (
+ *     <div>
+ *       <button onClick={recorder.startRecording}>
+ *         {recorder.isRecording() ? 'Recording...' : 'Edit Shortcut'}
+ *       </button>
+ *       <Show when={recorder.recordedHotkey()}>
+ *         <div>Recording: {recorder.recordedHotkey()}</div>
+ *       </Show>
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+declare function createHotkeyRecorder(options: HotkeyRecorderOptions | (() => HotkeyRecorderOptions)): SolidHotkeyRecorder;
+//#endregion
+export { SolidHotkeyRecorder, createHotkeyRecorder };
+//# sourceMappingURL=createHotkeyRecorder.d.cts.map

package/dist/createHotkeyRecorder.d.ts

@@ -0,0 +1,60 @@
+import { Hotkey, HotkeyRecorderOptions } from "@tanstack/hotkeys";
+
+//#region src/createHotkeyRecorder.d.ts
+interface SolidHotkeyRecorder {
+  /** Whether recording is currently active */
+  isRecording: () => boolean;
+  /** The currently recorded hotkey (for live preview) */
+  recordedHotkey: () => Hotkey | null;
+  /** Start recording a new hotkey */
+  startRecording: () => void;
+  /** Stop recording (same as cancel) */
+  stopRecording: () => void;
+  /** Cancel recording without saving */
+  cancelRecording: () => void;
+}
+/**
+ * SolidJS primitive for recording keyboard shortcuts.
+ *
+ * This primitive provides a thin wrapper around the framework-agnostic `HotkeyRecorder`
+ * class, managing all the complexity of capturing keyboard events, converting them
+ * to hotkey strings, and handling edge cases like Escape to cancel or Backspace/Delete
+ * to clear.
+ *
+ * This primitive uses `useStore` from `@tanstack/solid-store` to subscribe
+ * to the recorder's store state (same pattern as useHotkeyRecorder in React).
+ *
+ * @param options - Configuration options for the recorder (or accessor function)
+ * @returns An object with recording state signals and control functions
+ *
+ * @example
+ * ```tsx
+ * function ShortcutSettings() {
+ *   const [shortcut, setShortcut] = createSignal<Hotkey>('Mod+S')
+ *
+ *   const recorder = createHotkeyRecorder({
+ *     onRecord: (hotkey) => {
+ *       setShortcut(hotkey)
+ *     },
+ *     onCancel: () => {
+ *       console.log('Recording cancelled')
+ *     },
+ *   })
+ *
+ *   return (
+ *     <div>
+ *       <button onClick={recorder.startRecording}>
+ *         {recorder.isRecording() ? 'Recording...' : 'Edit Shortcut'}
+ *       </button>
+ *       <Show when={recorder.recordedHotkey()}>
+ *         <div>Recording: {recorder.recordedHotkey()}</div>
+ *       </Show>
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+declare function createHotkeyRecorder(options: HotkeyRecorderOptions | (() => HotkeyRecorderOptions)): SolidHotkeyRecorder;
+//#endregion
+export { SolidHotkeyRecorder, createHotkeyRecorder };
+//# sourceMappingURL=createHotkeyRecorder.d.ts.map