@tanstack/angular-hotkeys 0.10.0 → 0.11.0

package/README.md

@@ -1,5 +1,19 @@
 <div align="center">
-  <img src="./media/header_hotkeys.png" alt="TanStack Hotkeys" />
+  <picture>
+    <source
+      media="(prefers-color-scheme: dark)"
+      srcset="https://tanstack.com/api/readme/hotkeys.png?theme=dark"
+    />
+    <source
+      media="(prefers-color-scheme: light)"
+      srcset="https://tanstack.com/api/readme/hotkeys.png"
+    />
+    <img
+      src="https://tanstack.com/api/readme/hotkeys.png"
+      alt="TanStack Hotkeys"
+      width="900"
+    />
+  </picture>
 </div>
 
 <br />

package/dist/index.cjs

@@ -10,12 +10,14 @@ const require_injectKeyHold = require('./injectKeyHold.cjs');
 const require_injectHotkeyRecorder = require('./injectHotkeyRecorder.cjs');
 const require_injectHotkeyRegistrations = require('./injectHotkeyRegistrations.cjs');
 const require_injectHotkeySequenceRecorder = require('./injectHotkeySequenceRecorder.cjs');
+const require_injectHotkeyHint = require('./injectHotkeyHint.cjs');
 
 exports.HOTKEYS_INJECTION_TOKEN = require_hotkeys_provider.HOTKEYS_INJECTION_TOKEN;
 exports.injectDefaultHotkeysOptions = require_hotkeys_provider.injectDefaultHotkeysOptions;
 exports.injectHeldKeyCodes = require_injectHeldKeyCodes.injectHeldKeyCodes;
 exports.injectHeldKeys = require_injectHeldKeys.injectHeldKeys;
 exports.injectHotkey = require_injectHotkey.injectHotkey;
+exports.injectHotkeyHint = require_injectHotkeyHint.injectHotkeyHint;
 exports.injectHotkeyRecorder = require_injectHotkeyRecorder.injectHotkeyRecorder;
 exports.injectHotkeyRegistrations = require_injectHotkeyRegistrations.injectHotkeyRegistrations;
 exports.injectHotkeySequence = require_injectHotkeySequence.injectHotkeySequence;

package/dist/index.d.cts

@@ -9,5 +9,6 @@ import { injectKeyHold } from "./injectKeyHold.cjs";
 import { AngularHotkeyRecorder, injectHotkeyRecorder } from "./injectHotkeyRecorder.cjs";
 import { HotkeyRegistrationsResult, injectHotkeyRegistrations } from "./injectHotkeyRegistrations.cjs";
 import { AngularHotkeySequenceRecorder, injectHotkeySequenceRecorder } from "./injectHotkeySequenceRecorder.cjs";
+import { injectHotkeyHint } from "./injectHotkeyHint.cjs";
 export * from "@tanstack/hotkeys";
-export { AngularHotkeyRecorder, AngularHotkeySequenceRecorder, HOTKEYS_INJECTION_TOKEN, HotkeyRegistrationsResult, HotkeysContextValue, HotkeysProviderOptions, InjectHotkeyDefinition, InjectHotkeyOptions, InjectHotkeySequenceDefinition, InjectHotkeySequenceOptions, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeySequence, injectHotkeySequenceRecorder, injectHotkeySequences, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };
+export { AngularHotkeyRecorder, AngularHotkeySequenceRecorder, HOTKEYS_INJECTION_TOKEN, HotkeyRegistrationsResult, HotkeysContextValue, HotkeysProviderOptions, InjectHotkeyDefinition, InjectHotkeyOptions, InjectHotkeySequenceDefinition, InjectHotkeySequenceOptions, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyHint, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeySequence, injectHotkeySequenceRecorder, injectHotkeySequences, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };

package/dist/index.d.ts

@@ -9,5 +9,6 @@ import { injectKeyHold } from "./injectKeyHold.js";
 import { AngularHotkeyRecorder, injectHotkeyRecorder } from "./injectHotkeyRecorder.js";
 import { HotkeyRegistrationsResult, injectHotkeyRegistrations } from "./injectHotkeyRegistrations.js";
 import { AngularHotkeySequenceRecorder, injectHotkeySequenceRecorder } from "./injectHotkeySequenceRecorder.js";
+import { injectHotkeyHint } from "./injectHotkeyHint.js";
 export * from "@tanstack/hotkeys";
-export { AngularHotkeyRecorder, AngularHotkeySequenceRecorder, HOTKEYS_INJECTION_TOKEN, HotkeyRegistrationsResult, HotkeysContextValue, HotkeysProviderOptions, InjectHotkeyDefinition, InjectHotkeyOptions, InjectHotkeySequenceDefinition, InjectHotkeySequenceOptions, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeySequence, injectHotkeySequenceRecorder, injectHotkeySequences, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };
+export { AngularHotkeyRecorder, AngularHotkeySequenceRecorder, HOTKEYS_INJECTION_TOKEN, HotkeyRegistrationsResult, HotkeysContextValue, HotkeysProviderOptions, InjectHotkeyDefinition, InjectHotkeyOptions, InjectHotkeySequenceDefinition, InjectHotkeySequenceOptions, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyHint, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeySequence, injectHotkeySequenceRecorder, injectHotkeySequences, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };

package/dist/index.js

@@ -9,7 +9,8 @@ import { injectKeyHold } from "./injectKeyHold.js";
 import { injectHotkeyRecorder } from "./injectHotkeyRecorder.js";
 import { injectHotkeyRegistrations } from "./injectHotkeyRegistrations.js";
 import { injectHotkeySequenceRecorder } from "./injectHotkeySequenceRecorder.js";
+import { injectHotkeyHint } from "./injectHotkeyHint.js";
 
 export * from "@tanstack/hotkeys"
 
-export { HOTKEYS_INJECTION_TOKEN, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeySequence, injectHotkeySequenceRecorder, injectHotkeySequences, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };
+export { HOTKEYS_INJECTION_TOKEN, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyHint, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeySequence, injectHotkeySequenceRecorder, injectHotkeySequences, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };

package/dist/injectHotkeyHint.cjs

@@ -0,0 +1,20 @@
+let _tanstack_hotkeys = require("@tanstack/hotkeys");
+let _angular_core = require("@angular/core");
+let _tanstack_angular_store = require("@tanstack/angular-store");
+
+//#region src/injectHotkeyHint.ts
+/**
+* Returns a computed signal indicating whether held modifiers reveal this shortcut.
+* Call in an injection context; pass signal getters for changing inputs.
+* Uses the nonempty-subset/AltGr rules of `matchesHeldModifiers`; `exact` requires
+* every modifier. Combine with the action's enabled state before showing a badge.
+* This helper does not register a shortcut or check whether its target is focused.
+*/
+function injectHotkeyHint(hotkey, options = {}) {
+	const held = (0, _tanstack_angular_store.injectSelector)((0, _tanstack_hotkeys.getKeyStateTracker)().store, (state) => state.heldKeys);
+	return (0, _angular_core.computed)(() => (0, _tanstack_hotkeys.matchesHeldModifiers)(typeof hotkey === "function" ? hotkey() : hotkey, held(), typeof options === "function" ? options() : options));
+}
+
+//#endregion
+exports.injectHotkeyHint = injectHotkeyHint;
+//# sourceMappingURL=injectHotkeyHint.cjs.map

package/dist/injectHotkeyHint.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"injectHotkeyHint.cjs","names":[],"sources":["../src/injectHotkeyHint.ts"],"sourcesContent":["import { computed } from '@angular/core'\nimport { injectSelector } from '@tanstack/angular-store'\nimport { getKeyStateTracker, matchesHeldModifiers } from '@tanstack/hotkeys'\nimport type { Signal } from '@angular/core'\nimport type { HeldModifierOptions, RegisterableHotkey } from '@tanstack/hotkeys'\n\n/**\n * Returns a computed signal indicating whether held modifiers reveal this shortcut.\n * Call in an injection context; pass signal getters for changing inputs.\n * Uses the nonempty-subset/AltGr rules of `matchesHeldModifiers`; `exact` requires\n * every modifier. Combine with the action's enabled state before showing a badge.\n * This helper does not register a shortcut or check whether its target is focused.\n */\nexport function injectHotkeyHint(\n  hotkey: RegisterableHotkey | (() => RegisterableHotkey),\n  options: HeldModifierOptions | (() => HeldModifierOptions) = {},\n): Signal<boolean> {\n  const held = injectSelector(\n    getKeyStateTracker().store,\n    (state) => state.heldKeys,\n  )\n  return computed(() =>\n    matchesHeldModifiers(\n      typeof hotkey === 'function' ? hotkey() : hotkey,\n      held(),\n      typeof options === 'function' ? options() : options,\n    ),\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAaA,SAAgB,iBACd,QACA,UAA6D,EAAE,EAC9C;CACjB,MAAM,8FACgB,CAAC,QACpB,UAAU,MAAM,SAClB;AACD,sFAEI,OAAO,WAAW,aAAa,QAAQ,GAAG,QAC1C,MAAM,EACN,OAAO,YAAY,aAAa,SAAS,GAAG,QAC7C,CACF"}

package/dist/injectHotkeyHint.d.cts

@@ -0,0 +1,15 @@
+import { HeldModifierOptions, RegisterableHotkey } from "@tanstack/hotkeys";
+import { Signal } from "@angular/core";
+
+//#region src/injectHotkeyHint.d.ts
+/**
+ * Returns a computed signal indicating whether held modifiers reveal this shortcut.
+ * Call in an injection context; pass signal getters for changing inputs.
+ * Uses the nonempty-subset/AltGr rules of `matchesHeldModifiers`; `exact` requires
+ * every modifier. Combine with the action's enabled state before showing a badge.
+ * This helper does not register a shortcut or check whether its target is focused.
+ */
+declare function injectHotkeyHint(hotkey: RegisterableHotkey | (() => RegisterableHotkey), options?: HeldModifierOptions | (() => HeldModifierOptions)): Signal<boolean>;
+//#endregion
+export { injectHotkeyHint };
+//# sourceMappingURL=injectHotkeyHint.d.cts.map

package/dist/injectHotkeyHint.d.ts

@@ -0,0 +1,15 @@
+import { HeldModifierOptions, RegisterableHotkey } from "@tanstack/hotkeys";
+import { Signal } from "@angular/core";
+
+//#region src/injectHotkeyHint.d.ts
+/**
+ * Returns a computed signal indicating whether held modifiers reveal this shortcut.
+ * Call in an injection context; pass signal getters for changing inputs.
+ * Uses the nonempty-subset/AltGr rules of `matchesHeldModifiers`; `exact` requires
+ * every modifier. Combine with the action's enabled state before showing a badge.
+ * This helper does not register a shortcut or check whether its target is focused.
+ */
+declare function injectHotkeyHint(hotkey: RegisterableHotkey | (() => RegisterableHotkey), options?: HeldModifierOptions | (() => HeldModifierOptions)): Signal<boolean>;
+//#endregion
+export { injectHotkeyHint };
+//# sourceMappingURL=injectHotkeyHint.d.ts.map

package/dist/injectHotkeyHint.js

@@ -0,0 +1,20 @@
+import { getKeyStateTracker, matchesHeldModifiers } from "@tanstack/hotkeys";
+import { computed } from "@angular/core";
+import { injectSelector } from "@tanstack/angular-store";
+
+//#region src/injectHotkeyHint.ts
+/**
+* Returns a computed signal indicating whether held modifiers reveal this shortcut.
+* Call in an injection context; pass signal getters for changing inputs.
+* Uses the nonempty-subset/AltGr rules of `matchesHeldModifiers`; `exact` requires
+* every modifier. Combine with the action's enabled state before showing a badge.
+* This helper does not register a shortcut or check whether its target is focused.
+*/
+function injectHotkeyHint(hotkey, options = {}) {
+	const held = injectSelector(getKeyStateTracker().store, (state) => state.heldKeys);
+	return computed(() => matchesHeldModifiers(typeof hotkey === "function" ? hotkey() : hotkey, held(), typeof options === "function" ? options() : options));
+}
+
+//#endregion
+export { injectHotkeyHint };
+//# sourceMappingURL=injectHotkeyHint.js.map

package/dist/injectHotkeyHint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"injectHotkeyHint.js","names":[],"sources":["../src/injectHotkeyHint.ts"],"sourcesContent":["import { computed } from '@angular/core'\nimport { injectSelector } from '@tanstack/angular-store'\nimport { getKeyStateTracker, matchesHeldModifiers } from '@tanstack/hotkeys'\nimport type { Signal } from '@angular/core'\nimport type { HeldModifierOptions, RegisterableHotkey } from '@tanstack/hotkeys'\n\n/**\n * Returns a computed signal indicating whether held modifiers reveal this shortcut.\n * Call in an injection context; pass signal getters for changing inputs.\n * Uses the nonempty-subset/AltGr rules of `matchesHeldModifiers`; `exact` requires\n * every modifier. Combine with the action's enabled state before showing a badge.\n * This helper does not register a shortcut or check whether its target is focused.\n */\nexport function injectHotkeyHint(\n  hotkey: RegisterableHotkey | (() => RegisterableHotkey),\n  options: HeldModifierOptions | (() => HeldModifierOptions) = {},\n): Signal<boolean> {\n  const held = injectSelector(\n    getKeyStateTracker().store,\n    (state) => state.heldKeys,\n  )\n  return computed(() =>\n    matchesHeldModifiers(\n      typeof hotkey === 'function' ? hotkey() : hotkey,\n      held(),\n      typeof options === 'function' ? options() : options,\n    ),\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAaA,SAAgB,iBACd,QACA,UAA6D,EAAE,EAC9C;CACjB,MAAM,OAAO,eACX,oBAAoB,CAAC,QACpB,UAAU,MAAM,SAClB;AACD,QAAO,eACL,qBACE,OAAO,WAAW,aAAa,QAAQ,GAAG,QAC1C,MAAM,EACN,OAAO,YAAY,aAAa,SAAS,GAAG,QAC7C,CACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/angular-hotkeys",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "description": "Angular adapter for TanStack Hotkeys",
   "author": "Tanner Linsley",
   "license": "MIT",
@@ -42,16 +42,16 @@
   ],
   "dependencies": {
     "@tanstack/angular-store": "^0.11.0",
-    "@tanstack/hotkeys": "0.8.0"
+    "@tanstack/hotkeys": "0.9.0"
   },
   "peerDependencies": {
     "@angular/common": ">=19.0.0",
     "@angular/core": ">=19.0.0"
   },
   "devDependencies": {
-    "@angular/common": "^21.2.9",
-    "@angular/core": "^21.2.9",
-    "@angular/platform-browser-dynamic": "^21.2.9",
+    "@angular/common": "^21.2.10",
+    "@angular/core": "^21.2.10",
+    "@angular/platform-browser-dynamic": "^21.2.10",
     "typescript": "6.0.3"
   },
   "scripts": {

package/src/index.ts

@@ -15,3 +15,4 @@ export * from './injectKeyHold'
 export * from './injectHotkeyRecorder'
 export * from './injectHotkeyRegistrations'
 export * from './injectHotkeySequenceRecorder'
+export * from './injectHotkeyHint'

package/src/injectHotkeyHint.ts

@@ -0,0 +1,29 @@
+import { computed } from '@angular/core'
+import { injectSelector } from '@tanstack/angular-store'
+import { getKeyStateTracker, matchesHeldModifiers } from '@tanstack/hotkeys'
+import type { Signal } from '@angular/core'
+import type { HeldModifierOptions, RegisterableHotkey } from '@tanstack/hotkeys'
+
+/**
+ * Returns a computed signal indicating whether held modifiers reveal this shortcut.
+ * Call in an injection context; pass signal getters for changing inputs.
+ * Uses the nonempty-subset/AltGr rules of `matchesHeldModifiers`; `exact` requires
+ * every modifier. Combine with the action's enabled state before showing a badge.
+ * This helper does not register a shortcut or check whether its target is focused.
+ */
+export function injectHotkeyHint(
+  hotkey: RegisterableHotkey | (() => RegisterableHotkey),
+  options: HeldModifierOptions | (() => HeldModifierOptions) = {},
+): Signal<boolean> {
+  const held = injectSelector(
+    getKeyStateTracker().store,
+    (state) => state.heldKeys,
+  )
+  return computed(() =>
+    matchesHeldModifiers(
+      typeof hotkey === 'function' ? hotkey() : hotkey,
+      held(),
+      typeof options === 'function' ? options() : options,
+    ),
+  )
+}