@tanstack/angular-hotkeys 0.16.0 → 0.17.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/injectHotkeyHint.d.ts +5 -4
- package/dist/injectHotkeyHint.js +9 -6
- package/dist/injectHotkeyScopesState.d.ts +27 -0
- package/dist/injectHotkeyScopesState.js +32 -0
- package/package.json +2 -2
- package/skills/angular-hotkeys/SKILL.md +17 -16
package/dist/index.d.ts
CHANGED
|
@@ -6,7 +6,8 @@ import { injectHeldKeyCodes } from "./injectHeldKeyCodes.js";
|
|
|
6
6
|
import { injectKeyHold } from "./injectKeyHold.js";
|
|
7
7
|
import { AngularHotkeyRecorder, injectHotkeyRecorder } from "./injectHotkeyRecorder.js";
|
|
8
8
|
import { injectHotkeyRegistrations } from "./injectHotkeyRegistrations.js";
|
|
9
|
+
import { injectHotkeyScopesState } from "./injectHotkeyScopesState.js";
|
|
9
10
|
import { injectHotkeyHint } from "./injectHotkeyHint.js";
|
|
10
11
|
import { InjectCustomHotkeysResult, injectAppHotkeyList, injectAppHotkeys, injectCustomHotkeys } from "./injectAppHotkeys.js";
|
|
11
12
|
export * from "@tanstack/hotkeys";
|
|
12
|
-
export { AngularHotkeyRecorder, HOTKEYS_INJECTION_TOKEN, HotkeysContextValue, HotkeysProviderOptions, InjectAppHotkeyOptions, InjectCustomHotkeysResult, InjectHotkeyChordOptions, InjectHotkeyCommonOptions, InjectHotkeyDefinition, InjectHotkeyOptions, InjectHotkeyOptionsFor, InjectHotkeySequenceOptions, InjectHotkeyTarget, MaybeGetter, ProvideHotkeysOptions, injectAppHotkeyList, injectAppHotkeys, injectCustomHotkeys, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyHint, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };
|
|
13
|
+
export { AngularHotkeyRecorder, HOTKEYS_INJECTION_TOKEN, HotkeysContextValue, HotkeysProviderOptions, InjectAppHotkeyOptions, InjectCustomHotkeysResult, InjectHotkeyChordOptions, InjectHotkeyCommonOptions, InjectHotkeyDefinition, InjectHotkeyOptions, InjectHotkeyOptionsFor, InjectHotkeySequenceOptions, InjectHotkeyTarget, MaybeGetter, ProvideHotkeysOptions, injectAppHotkeyList, injectAppHotkeys, injectCustomHotkeys, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyHint, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeyScopesState, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };
|
package/dist/index.js
CHANGED
|
@@ -6,9 +6,10 @@ import { injectHeldKeyCodes } from "./injectHeldKeyCodes.js";
|
|
|
6
6
|
import { injectKeyHold } from "./injectKeyHold.js";
|
|
7
7
|
import { injectHotkeyRecorder } from "./injectHotkeyRecorder.js";
|
|
8
8
|
import { injectHotkeyRegistrations } from "./injectHotkeyRegistrations.js";
|
|
9
|
+
import { injectHotkeyScopesState } from "./injectHotkeyScopesState.js";
|
|
9
10
|
import { injectHotkeyHint } from "./injectHotkeyHint.js";
|
|
10
11
|
import { injectAppHotkeyList, injectAppHotkeys, injectCustomHotkeys } from "./injectAppHotkeys.js";
|
|
11
12
|
|
|
12
13
|
export * from "@tanstack/hotkeys"
|
|
13
14
|
|
|
14
|
-
export { HOTKEYS_INJECTION_TOKEN, injectAppHotkeyList, injectAppHotkeys, injectCustomHotkeys, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyHint, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };
|
|
15
|
+
export { HOTKEYS_INJECTION_TOKEN, injectAppHotkeyList, injectAppHotkeys, injectCustomHotkeys, injectDefaultHotkeysOptions, injectHeldKeyCodes, injectHeldKeys, injectHotkey, injectHotkeyHint, injectHotkeyRecorder, injectHotkeyRegistrations, injectHotkeyScopesState, injectHotkeys, injectHotkeysContext, injectKeyHold, provideHotkeys };
|
|
@@ -3,10 +3,11 @@ import { Signal } from "@angular/core";
|
|
|
3
3
|
//#region src/injectHotkeyHint.d.ts
|
|
4
4
|
/**
|
|
5
5
|
* Returns a signal indicating whether held modifiers reveal this shortcut.
|
|
6
|
-
*
|
|
7
|
-
*
|
|
8
|
-
*
|
|
9
|
-
*
|
|
6
|
+
* The hint shows only while the hotkey can fire: some registration of it is
|
|
7
|
+
* enabled and in an active scope. Pass getters to track changing hotkeys and
|
|
8
|
+
* options. A sequence reveals its hint from its first step, and an app hotkey
|
|
9
|
+
* matches its registrations by id and uses its effective hotkey (false while
|
|
10
|
+
* unbound). This helper does not register a shortcut. A hotkey on an element counts only while focus is inside it.
|
|
10
11
|
*/
|
|
11
12
|
export declare function injectHotkeyHint(hotkey: RegisterableHotkey | AppHotkey | (() => RegisterableHotkey | AppHotkey), options?: HeldModifierOptions | (() => HeldModifierOptions)): Signal<boolean>;
|
|
12
13
|
//#endregion
|
package/dist/injectHotkeyHint.js
CHANGED
|
@@ -1,24 +1,27 @@
|
|
|
1
1
|
import { injectHotkeysContext } from "./hotkeys-provider.js";
|
|
2
|
-
import { getKeyStateTracker, isAppHotkey, matchesHeldModifiers, resolveAppHotkey } from "@tanstack/hotkeys";
|
|
2
|
+
import { getHotkeyManager, getKeyStateTracker, isAppHotkey, matchesHeldModifiers, resolveAppHotkey } from "@tanstack/hotkeys";
|
|
3
3
|
import { computed } from "@angular/core";
|
|
4
4
|
import { injectSelector } from "@tanstack/angular-store";
|
|
5
5
|
|
|
6
6
|
//#region src/injectHotkeyHint.ts
|
|
7
7
|
/**
|
|
8
8
|
* Returns a signal indicating whether held modifiers reveal this shortcut.
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
9
|
+
* The hint shows only while the hotkey can fire: some registration of it is
|
|
10
|
+
* enabled and in an active scope. Pass getters to track changing hotkeys and
|
|
11
|
+
* options. A sequence reveals its hint from its first step, and an app hotkey
|
|
12
|
+
* matches its registrations by id and uses its effective hotkey (false while
|
|
13
|
+
* unbound). This helper does not register a shortcut. A hotkey on an element counts only while focus is inside it.
|
|
13
14
|
*/
|
|
14
15
|
function injectHotkeyHint(hotkey, options = {}) {
|
|
15
16
|
const context = injectHotkeysContext();
|
|
17
|
+
const manager = getHotkeyManager();
|
|
18
|
+
const registrations = injectSelector(manager.registrations, (state) => state);
|
|
16
19
|
const held = injectSelector(getKeyStateTracker().store, (state) => state.heldKeys);
|
|
17
20
|
return computed(() => {
|
|
18
21
|
context.appHotkeysState();
|
|
19
22
|
const value = typeof hotkey === "function" ? hotkey() : hotkey;
|
|
20
23
|
const resolved = isAppHotkey(value) ? resolveAppHotkey(value, context.appHotkeysStore).hotkey : value;
|
|
21
|
-
return resolved !== null && matchesHeldModifiers(resolved, held(), typeof options === "function" ? options() : options);
|
|
24
|
+
return resolved !== null && matchesHeldModifiers(resolved, held(), typeof options === "function" ? options() : options) && registrations().size > 0 && manager.hasActiveRegistration(value);
|
|
22
25
|
});
|
|
23
26
|
}
|
|
24
27
|
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { HotkeyScopesState } from "@tanstack/hotkeys";
|
|
2
|
+
import { Signal } from "@angular/core";
|
|
3
|
+
//#region src/injectHotkeyScopesState.d.ts
|
|
4
|
+
/**
|
|
5
|
+
* Angular inject-based API that returns a signal of the hotkey manager's
|
|
6
|
+
* scope state: the active scopes, the exclusive scope that owns the keyboard,
|
|
7
|
+
* and the scopes it allows or suspends. Updates when scopes activate or
|
|
8
|
+
* release.
|
|
9
|
+
*
|
|
10
|
+
* @returns Signal of the current scope state
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```ts
|
|
14
|
+
* @Component({
|
|
15
|
+
* template: `
|
|
16
|
+
* @if (scopes().exclusive; as exclusive) {
|
|
17
|
+
* <p>Shortcuts belong to {{ exclusive }}</p>
|
|
18
|
+
* }
|
|
19
|
+
* `,
|
|
20
|
+
* })
|
|
21
|
+
* export class KeyboardOwnerComponent {
|
|
22
|
+
* scopes = injectHotkeyScopesState()
|
|
23
|
+
* }
|
|
24
|
+
* ```
|
|
25
|
+
*/
|
|
26
|
+
export declare function injectHotkeyScopesState(): Signal<HotkeyScopesState>;
|
|
27
|
+
//#endregion
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { getHotkeyManager } from "@tanstack/hotkeys";
|
|
2
|
+
import { injectSelector } from "@tanstack/angular-store";
|
|
3
|
+
|
|
4
|
+
//#region src/injectHotkeyScopesState.ts
|
|
5
|
+
/**
|
|
6
|
+
* Angular inject-based API that returns a signal of the hotkey manager's
|
|
7
|
+
* scope state: the active scopes, the exclusive scope that owns the keyboard,
|
|
8
|
+
* and the scopes it allows or suspends. Updates when scopes activate or
|
|
9
|
+
* release.
|
|
10
|
+
*
|
|
11
|
+
* @returns Signal of the current scope state
|
|
12
|
+
*
|
|
13
|
+
* @example
|
|
14
|
+
* ```ts
|
|
15
|
+
* @Component({
|
|
16
|
+
* template: `
|
|
17
|
+
* @if (scopes().exclusive; as exclusive) {
|
|
18
|
+
* <p>Shortcuts belong to {{ exclusive }}</p>
|
|
19
|
+
* }
|
|
20
|
+
* `,
|
|
21
|
+
* })
|
|
22
|
+
* export class KeyboardOwnerComponent {
|
|
23
|
+
* scopes = injectHotkeyScopesState()
|
|
24
|
+
* }
|
|
25
|
+
* ```
|
|
26
|
+
*/
|
|
27
|
+
function injectHotkeyScopesState() {
|
|
28
|
+
return injectSelector(getHotkeyManager().scopes, (state) => state);
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
//#endregion
|
|
32
|
+
export { injectHotkeyScopesState };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/angular-hotkeys",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.17.1",
|
|
4
4
|
"description": "Angular adapter for TanStack Hotkeys",
|
|
5
5
|
"author": "Tanner Linsley",
|
|
6
6
|
"license": "MIT",
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
],
|
|
39
39
|
"dependencies": {
|
|
40
40
|
"@tanstack/angular-store": "^0.11.2",
|
|
41
|
-
"@tanstack/hotkeys": "0.
|
|
41
|
+
"@tanstack/hotkeys": "0.19.0"
|
|
42
42
|
},
|
|
43
43
|
"peerDependencies": {
|
|
44
44
|
"@angular/common": ">=19.0.0",
|
|
@@ -64,22 +64,23 @@ export class PanelComponent {
|
|
|
64
64
|
|
|
65
65
|
## API
|
|
66
66
|
|
|
67
|
-
| API | What it's for
|
|
68
|
-
| -------------------------------------------- |
|
|
69
|
-
| `injectHotkey(hotkey, callback, options?)` | Register one chord, sequence, or app hotkey for the component's or service's lifetime; options can be a function that reads signals.
|
|
70
|
-
| `injectHotkeys(definitions, commonOptions?)` | Register several hotkeys, or a function returning a list built from data, in one call.
|
|
71
|
-
| `provideHotkeys(options)` | Set default options, a scope (`exclusive` for dialogs), `enabled`, and app hotkeys in the app config or a component's `providers`.
|
|
72
|
-
| `injectHotkeysContext()` | Read the nearest provided defaults and enabled state, or `null` without a provider.
|
|
73
|
-
| `injectDefaultHotkeysOptions()` | Read the default options merged from every provider above.
|
|
74
|
-
| `injectAppHotkeys()` | Get a signal of the declared app hotkeys with the user's custom hotkeys applied.
|
|
75
|
-
| `injectAppHotkeyList()` | Get a signal listing every app hotkey with its status, for a cheat sheet or settings screen.
|
|
76
|
-
| `injectCustomHotkeys()` | Read, change, and reset the user's custom hotkeys, and check a new one for conflicts.
|
|
77
|
-
| `injectHotkeyRecorder(options)` | Record a chord or sequence the user presses, for a settings screen.
|
|
78
|
-
| `injectHotkeyRegistrations()` | Get a signal listing every registered hotkey with its options and `
|
|
79
|
-
| `
|
|
80
|
-
| `
|
|
81
|
-
| `
|
|
82
|
-
| `
|
|
67
|
+
| API | What it's for |
|
|
68
|
+
| -------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
69
|
+
| `injectHotkey(hotkey, callback, options?)` | Register one chord, sequence, or app hotkey for the component's or service's lifetime; options can be a function that reads signals. |
|
|
70
|
+
| `injectHotkeys(definitions, commonOptions?)` | Register several hotkeys, or a function returning a list built from data, in one call. |
|
|
71
|
+
| `provideHotkeys(options)` | Set default options, a scope (`exclusive` for dialogs), `enabled`, and app hotkeys in the app config or a component's `providers`. |
|
|
72
|
+
| `injectHotkeysContext()` | Read the nearest provided defaults and enabled state, or `null` without a provider. |
|
|
73
|
+
| `injectDefaultHotkeysOptions()` | Read the default options merged from every provider above. |
|
|
74
|
+
| `injectAppHotkeys()` | Get a signal of the declared app hotkeys with the user's custom hotkeys applied. |
|
|
75
|
+
| `injectAppHotkeyList()` | Get a signal listing every app hotkey with its status, for a cheat sheet or settings screen. |
|
|
76
|
+
| `injectCustomHotkeys()` | Read, change, and reset the user's custom hotkeys, and check a new one for conflicts. |
|
|
77
|
+
| `injectHotkeyRecorder(options)` | Record a chord or sequence the user presses, for a settings screen. |
|
|
78
|
+
| `injectHotkeyRegistrations()` | Get a signal listing every registered hotkey with its options, `meta`, and `status` (whether it's enabled and in an active scope). |
|
|
79
|
+
| `injectHotkeyScopesState()` | Get a signal of the active scopes and the exclusive scope that owns the keyboard. |
|
|
80
|
+
| `injectHotkeyHint(hotkey, options?)` | Get a signal of whether held modifiers should reveal a shortcut's hint. False unless a registration of the hotkey can fire: enabled, in an active scope, and with focus inside its element target. |
|
|
81
|
+
| `injectKeyHold(key)` | Get a signal of whether one key is held. |
|
|
82
|
+
| `injectHeldKeys()` | Get a signal of every key that's held right now. |
|
|
83
|
+
| `injectHeldKeyCodes()` | Get a signal mapping each held key to its physical `event.code`. |
|
|
83
84
|
|
|
84
85
|
The package also re-exports `@tanstack/hotkeys`, such as `formatForDisplay`, `matchesKeyboardEvent`, and `defineAppHotkeys`.
|
|
85
86
|
|