@tanstack/ember-hotkeys 0.1.0
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/README.md +140 -0
- package/addon-main.cjs +4 -0
- package/dist/createHotkeysScope.d.ts +28 -0
- package/dist/createHotkeysScope.js +78 -0
- package/dist/index.d.ts +19 -0
- package/dist/index.js +18 -0
- package/dist/onHotkey.d.ts +19 -0
- package/dist/onHotkey.js +30 -0
- package/dist/onHotkeys.d.ts +22 -0
- package/dist/onHotkeys.js +35 -0
- package/dist/types.d.ts +49 -0
- package/dist/useHeldKeyCodes.d.ts +5 -0
- package/dist/useHeldKeyCodes.js +11 -0
- package/dist/useHeldKeys.d.ts +5 -0
- package/dist/useHeldKeys.js +11 -0
- package/dist/useHotkey.d.ts +18 -0
- package/dist/useHotkey.js +27 -0
- package/dist/useHotkeyHint.d.ts +7 -0
- package/dist/useHotkeyHint.js +11 -0
- package/dist/useHotkeyRecorder.d.ts +7 -0
- package/dist/useHotkeyRecorder.js +28 -0
- package/dist/useHotkeyRegistrations.d.ts +5 -0
- package/dist/useHotkeyRegistrations.js +20 -0
- package/dist/useHotkeySequence.d.ts +18 -0
- package/dist/useHotkeySequence.js +27 -0
- package/dist/useHotkeySequenceRecorder.d.ts +7 -0
- package/dist/useHotkeySequenceRecorder.js +32 -0
- package/dist/useHotkeySequences.d.ts +20 -0
- package/dist/useHotkeySequences.js +29 -0
- package/dist/useHotkeys.d.ts +20 -0
- package/dist/useHotkeys.js +29 -0
- package/dist/useKeyHold.d.ts +7 -0
- package/dist/useKeyHold.js +11 -0
- package/dist/utils.d.ts +4 -0
- package/dist/utils.js +20 -0
- package/package.json +98 -0
package/README.md
ADDED
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
<div align="center">
|
|
2
|
+
<picture>
|
|
3
|
+
<source
|
|
4
|
+
media="(prefers-color-scheme: dark)"
|
|
5
|
+
srcset="https://tanstack.com/api/readme/hotkeys.png?theme=dark"
|
|
6
|
+
/>
|
|
7
|
+
<source
|
|
8
|
+
media="(prefers-color-scheme: light)"
|
|
9
|
+
srcset="https://tanstack.com/api/readme/hotkeys.png"
|
|
10
|
+
/>
|
|
11
|
+
<img
|
|
12
|
+
src="https://tanstack.com/api/readme/hotkeys.png"
|
|
13
|
+
alt="TanStack Hotkeys"
|
|
14
|
+
width="900"
|
|
15
|
+
/>
|
|
16
|
+
</picture>
|
|
17
|
+
</div>
|
|
18
|
+
|
|
19
|
+
<br />
|
|
20
|
+
|
|
21
|
+
<div align="center">
|
|
22
|
+
<a href="https://www.npmjs.com/package/@tanstack/hotkeys" target="\_parent">
|
|
23
|
+
<img alt="" src="https://img.shields.io/npm/dm/@tanstack/hotkeys.svg" alt="npm downloads" />
|
|
24
|
+
</a>
|
|
25
|
+
<a href="https://github.com/TanStack/hotkeys" target="\_parent">
|
|
26
|
+
<img alt="" src="https://img.shields.io/github/stars/TanStack/hotkeys.svg?style=social&label=Star" alt="GitHub stars" />
|
|
27
|
+
</a>
|
|
28
|
+
<a href="https://bundlephobia.com/result?p=@tanstack/react-hotkeys@latest" target="\_parent">
|
|
29
|
+
<img alt="" src="https://badgen.net/bundlephobia/minzip/@tanstack/react-hotkeys@latest" alt="Bundle size" />
|
|
30
|
+
</a>
|
|
31
|
+
</div>
|
|
32
|
+
|
|
33
|
+
<div align="center">
|
|
34
|
+
<a href="#badge">
|
|
35
|
+
<img alt="semantic-release" src="https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg">
|
|
36
|
+
</a>
|
|
37
|
+
<a href="#badge">
|
|
38
|
+
<img src="https://img.shields.io/github/v/release/tanstack/hotkeys" alt="Release"/>
|
|
39
|
+
</a>
|
|
40
|
+
<a href="https://twitter.com/tan_stack">
|
|
41
|
+
<img src="https://img.shields.io/twitter/follow/tan_stack.svg?style=social" alt="Follow @TanStack"/>
|
|
42
|
+
</a>
|
|
43
|
+
</div>
|
|
44
|
+
|
|
45
|
+
<div align="center">
|
|
46
|
+
|
|
47
|
+
### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)
|
|
48
|
+
|
|
49
|
+
</div>
|
|
50
|
+
|
|
51
|
+
# TanStack Hotkeys
|
|
52
|
+
|
|
53
|
+
> [!NOTE]
|
|
54
|
+
> TanStack Hotkeys is alpha. We are actively developing the library and are open to feedback and contributions.
|
|
55
|
+
|
|
56
|
+
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.
|
|
57
|
+
|
|
58
|
+
- Type-safe bindings — template strings (`Mod+Shift+S`, `Escape`) or parsed objects for full control
|
|
59
|
+
- Flexible options — `keydown`/`keyup`, `preventDefault`, `stopPropagation`, conditional enabled, `requireReset`
|
|
60
|
+
- Cross-platform Mod — maps to Cmd on macOS and Ctrl on Windows/Linux
|
|
61
|
+
- Batteries included — validation + matching, sequences (Vim-style), key-state tracking, recorder UI helpers, framework adapters, and devtools
|
|
62
|
+
|
|
63
|
+
### <a href="https://tanstack.com/hotkeys">Read the docs →</a>
|
|
64
|
+
|
|
65
|
+
<br />
|
|
66
|
+
|
|
67
|
+
> [!NOTE]
|
|
68
|
+
> You may know **TanStack Hotkeys** by our adapter names, too!
|
|
69
|
+
>
|
|
70
|
+
> - [**Alpine Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/alpine/quick-start)
|
|
71
|
+
> - [**Ember Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/ember/quick-start)
|
|
72
|
+
> - [**Octane Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/octane/quick-start)
|
|
73
|
+
> - [**React Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/react/react-hotkeys)
|
|
74
|
+
> - [**Preact Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/preact/preact-hotkeys)
|
|
75
|
+
> - [**Solid Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/solid/reference)
|
|
76
|
+
> - [**Angular Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/angular/reference)
|
|
77
|
+
> - [**Vue Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/vue/reference)
|
|
78
|
+
> - [**Lit Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/lit/reference)
|
|
79
|
+
> - [**Svelte Hotkeys**](https://tanstack.com/hotkeys/latest/docs/framework/svelte/reference)
|
|
80
|
+
|
|
81
|
+
## Get Involved
|
|
82
|
+
|
|
83
|
+
- We welcome issues and pull requests!
|
|
84
|
+
- Participate in [GitHub discussions](https://github.com/TanStack/hotkeys/discussions)
|
|
85
|
+
- Chat with the community on [Discord](https://discord.com/invite/WrRKjPJ)
|
|
86
|
+
- See [CONTRIBUTING.md](./CONTRIBUTING.md) for setup instructions
|
|
87
|
+
|
|
88
|
+
## Partners
|
|
89
|
+
|
|
90
|
+
<div align="center">
|
|
91
|
+
|
|
92
|
+
<table align="center">
|
|
93
|
+
<tr>
|
|
94
|
+
<td>
|
|
95
|
+
<a href="https://www.coderabbit.ai/?via=tanstack&dub_id=aCcEEdAOqqutX6OS" >
|
|
96
|
+
<picture>
|
|
97
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://tanstack.com/assets/coderabbit-dark-D643Zkrv.svg" height="40" />
|
|
98
|
+
<source media="(prefers-color-scheme: light)" srcset="https://tanstack.com/assets/coderabbit-light-CIzGLYU_.svg" height="40" />
|
|
99
|
+
<img src="https://tanstack.com/assets/coderabbit-light-DVMJ2jHi.svg" height="40" alt="CodeRabbit" />
|
|
100
|
+
</picture>
|
|
101
|
+
</a>
|
|
102
|
+
</td>
|
|
103
|
+
<td>
|
|
104
|
+
<a href="https://www.cloudflare.com?utm_source=tanstack">
|
|
105
|
+
<picture>
|
|
106
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://tanstack.com/assets/cloudflare-white-Co-Tyjbl.svg" height="60" />
|
|
107
|
+
<source media="(prefers-color-scheme: light)" srcset="https://tanstack.com/assets/cloudflare-black-6Ojsn8yh.svg" height="60" />
|
|
108
|
+
<img src="https://tanstack.com/assets/cloudflare-black-CPufaW0B.svg" height="60" alt="Cloudflare" />
|
|
109
|
+
</picture>
|
|
110
|
+
</a>
|
|
111
|
+
</td>
|
|
112
|
+
</tr>
|
|
113
|
+
</table>
|
|
114
|
+
|
|
115
|
+
<div align="center">
|
|
116
|
+
<img src="media/partner_logo.svg" alt="Keys & you?" height="65">
|
|
117
|
+
<p>
|
|
118
|
+
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.
|
|
119
|
+
</p>
|
|
120
|
+
<a href="mailto:partners@tanstack.com?subject=TanStack Hotkeys Partnership"><b>LET'S CHAT</b></a>
|
|
121
|
+
</div>
|
|
122
|
+
|
|
123
|
+
</div>
|
|
124
|
+
|
|
125
|
+
## Explore the TanStack Ecosystem
|
|
126
|
+
|
|
127
|
+
- <a href="https://github.com/tanstack/config"><b>TanStack Config</b></a> – Tooling for JS/TS packages
|
|
128
|
+
- <a href="https://github.com/tanstack/db"><b>TanStack DB</b></a> – Reactive sync client store
|
|
129
|
+
- <a href="https://github.com/tanstack/devtools"><b>TanStack DevTools</b></a> – Unified devtools panel
|
|
130
|
+
- <a href="https://github.com/tanstack/form"><b>TanStack Form</b></a> – Type‑safe form state
|
|
131
|
+
- <a href="https://github.com/tanstack/hotkeys"><b>TanStack Hotkeys</b></a> – Type‑safe keyboard shortcuts
|
|
132
|
+
- <a href="https://github.com/tanstack/query"><b>TanStack Query</b></a> – Async state & caching
|
|
133
|
+
- <a href="https://github.com/tanstack/ranger"><b>TanStack Ranger</b></a> – Range & slider primitives
|
|
134
|
+
- <a href="https://github.com/tanstack/router"><b>TanStack Router</b></a> – Type‑safe routing, caching & URL state
|
|
135
|
+
- <a href="https://github.com/tanstack/start"><b>TanStack Start</b></a> – Full‑stack SSR & streaming
|
|
136
|
+
- <a href="https://github.com/tanstack/store"><b>TanStack Store</b></a> – Reactive data store
|
|
137
|
+
- <a href="https://github.com/tanstack/table"><b>TanStack Table</b></a> – Headless datagrids
|
|
138
|
+
- <a href="https://github.com/tanstack/virtual"><b>TanStack Virtual</b></a> – Virtualized rendering
|
|
139
|
+
|
|
140
|
+
… and more at <a href="https://tanstack.com"><b>TanStack.com »</b></a>
|
package/addon-main.cjs
ADDED
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { UseHotkey } from "./useHotkey.js";
|
|
2
|
+
import { UseHotkeys } from "./useHotkeys.js";
|
|
3
|
+
import { UseHotkeySequence } from "./useHotkeySequence.js";
|
|
4
|
+
import { UseHotkeySequences } from "./useHotkeySequences.js";
|
|
5
|
+
import { MaybeGetter } from "./utils.js";
|
|
6
|
+
import { DefaultHotkeysOptions } from "./types.js";
|
|
7
|
+
import { useHotkeyRecorder } from "./useHotkeyRecorder.js";
|
|
8
|
+
import { useHotkeySequenceRecorder } from "./useHotkeySequenceRecorder.js";
|
|
9
|
+
import { OnHotkeys } from "./onHotkeys.js";
|
|
10
|
+
import { OnHotkey } from "./onHotkey.js";
|
|
11
|
+
//#region src/createHotkeysScope.d.ts
|
|
12
|
+
/** Helpers, modifiers, and recorder factories with shared defaults. Owners retain their own cleanup. */
|
|
13
|
+
export interface EmberHotkeysScope {
|
|
14
|
+
onHotkey: typeof OnHotkey;
|
|
15
|
+
onHotkeys: typeof OnHotkeys;
|
|
16
|
+
useHotkey: typeof UseHotkey;
|
|
17
|
+
useHotkeys: typeof UseHotkeys;
|
|
18
|
+
useHotkeySequence: typeof UseHotkeySequence;
|
|
19
|
+
useHotkeySequences: typeof UseHotkeySequences;
|
|
20
|
+
useHotkeyRecorder: typeof useHotkeyRecorder;
|
|
21
|
+
useHotkeySequenceRecorder: typeof useHotkeySequenceRecorder;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* Creates contextual helpers, modifiers, and recorders with shared, optionally reactive defaults.
|
|
25
|
+
* Pass the scope to child components through arguments to share configuration.
|
|
26
|
+
*/
|
|
27
|
+
export declare function createHotkeysScope(defaultOptions?: MaybeGetter<DefaultHotkeysOptions>): EmberHotkeysScope;
|
|
28
|
+
//#endregion
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import { UseHotkey } from "./useHotkey.js";
|
|
2
|
+
import { UseHotkeys } from "./useHotkeys.js";
|
|
3
|
+
import { UseHotkeySequence } from "./useHotkeySequence.js";
|
|
4
|
+
import { UseHotkeySequences } from "./useHotkeySequences.js";
|
|
5
|
+
import { read } from "./utils.js";
|
|
6
|
+
import { useHotkeyRecorder } from "./useHotkeyRecorder.js";
|
|
7
|
+
import { useHotkeySequenceRecorder } from "./useHotkeySequenceRecorder.js";
|
|
8
|
+
import { OnHotkey } from "./onHotkey.js";
|
|
9
|
+
import { OnHotkeys } from "./onHotkeys.js";
|
|
10
|
+
|
|
11
|
+
//#region src/createHotkeysScope.ts
|
|
12
|
+
/**
|
|
13
|
+
* Creates contextual helpers, modifiers, and recorders with shared, optionally reactive defaults.
|
|
14
|
+
* Pass the scope to child components through arguments to share configuration.
|
|
15
|
+
*/
|
|
16
|
+
function createHotkeysScope(defaultOptions = {}) {
|
|
17
|
+
return {
|
|
18
|
+
onHotkey: class extends OnHotkey {
|
|
19
|
+
modify(...[element, args, options]) {
|
|
20
|
+
super.modify(element, args, {
|
|
21
|
+
...read(defaultOptions).hotkey,
|
|
22
|
+
...options
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
},
|
|
26
|
+
onHotkeys: class extends OnHotkeys {
|
|
27
|
+
modify(...[element, args, options]) {
|
|
28
|
+
super.modify(element, args, {
|
|
29
|
+
...read(defaultOptions).hotkey,
|
|
30
|
+
...options
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
useHotkey: class extends UseHotkey {
|
|
35
|
+
compute(...[args, options]) {
|
|
36
|
+
super.compute(args, {
|
|
37
|
+
...read(defaultOptions).hotkey,
|
|
38
|
+
...options
|
|
39
|
+
});
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
useHotkeys: class extends UseHotkeys {
|
|
43
|
+
compute(...[args, options]) {
|
|
44
|
+
super.compute(args, {
|
|
45
|
+
...read(defaultOptions).hotkey,
|
|
46
|
+
...options
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
},
|
|
50
|
+
useHotkeySequence: class extends UseHotkeySequence {
|
|
51
|
+
compute(...[args, options]) {
|
|
52
|
+
super.compute(args, {
|
|
53
|
+
...read(defaultOptions).hotkeySequence,
|
|
54
|
+
...options
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
},
|
|
58
|
+
useHotkeySequences: class extends UseHotkeySequences {
|
|
59
|
+
compute(...[args, options]) {
|
|
60
|
+
super.compute(args, {
|
|
61
|
+
...read(defaultOptions).hotkeySequence,
|
|
62
|
+
...options
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
},
|
|
66
|
+
useHotkeyRecorder: (owner, options) => useHotkeyRecorder(owner, () => ({
|
|
67
|
+
...read(defaultOptions).hotkeyRecorder,
|
|
68
|
+
...read(options)
|
|
69
|
+
})),
|
|
70
|
+
useHotkeySequenceRecorder: (owner, options) => useHotkeySequenceRecorder(owner, () => ({
|
|
71
|
+
...read(defaultOptions).hotkeySequenceRecorder,
|
|
72
|
+
...read(options)
|
|
73
|
+
}))
|
|
74
|
+
};
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
//#endregion
|
|
78
|
+
export { createHotkeysScope };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { UseHotkey } from "./useHotkey.js";
|
|
2
|
+
import { UseHotkeys } from "./useHotkeys.js";
|
|
3
|
+
import { UseHotkeySequence } from "./useHotkeySequence.js";
|
|
4
|
+
import { UseHotkeySequences } from "./useHotkeySequences.js";
|
|
5
|
+
import { MaybeGetter } from "./utils.js";
|
|
6
|
+
import { DefaultHotkeysOptions, EmberHotkeyRecorder, EmberHotkeySequenceRecorder, EmberHotkeyState, HotkeyRegistrationsResult } from "./types.js";
|
|
7
|
+
import { useHeldKeys } from "./useHeldKeys.js";
|
|
8
|
+
import { useHeldKeyCodes } from "./useHeldKeyCodes.js";
|
|
9
|
+
import { useKeyHold } from "./useKeyHold.js";
|
|
10
|
+
import { useHotkeyHint } from "./useHotkeyHint.js";
|
|
11
|
+
import { useHotkeyRegistrations } from "./useHotkeyRegistrations.js";
|
|
12
|
+
import { useHotkeyRecorder } from "./useHotkeyRecorder.js";
|
|
13
|
+
import { useHotkeySequenceRecorder } from "./useHotkeySequenceRecorder.js";
|
|
14
|
+
import { ElementHotkeyOptions, OnHotkeys } from "./onHotkeys.js";
|
|
15
|
+
import { OnHotkey } from "./onHotkey.js";
|
|
16
|
+
import { EmberHotkeysScope, createHotkeysScope } from "./createHotkeysScope.js";
|
|
17
|
+
import { HotkeyDefinition, HotkeySequenceDefinition } from "@tanstack/hotkeys/adapter";
|
|
18
|
+
export * from "@tanstack/hotkeys";
|
|
19
|
+
export { DefaultHotkeysOptions, type ElementHotkeyOptions, EmberHotkeyRecorder, EmberHotkeySequenceRecorder, EmberHotkeyState, EmberHotkeysScope, type HotkeyDefinition, HotkeyRegistrationsResult, type HotkeySequenceDefinition, type MaybeGetter, createHotkeysScope, OnHotkey as onHotkey, OnHotkeys as onHotkeys, useHeldKeyCodes, useHeldKeys, UseHotkey as useHotkey, useHotkeyHint, useHotkeyRecorder, useHotkeyRegistrations, UseHotkeySequence as useHotkeySequence, useHotkeySequenceRecorder, UseHotkeySequences as useHotkeySequences, UseHotkeys as useHotkeys, useKeyHold };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { UseHotkey } from "./useHotkey.js";
|
|
2
|
+
import { UseHotkeys } from "./useHotkeys.js";
|
|
3
|
+
import { UseHotkeySequence } from "./useHotkeySequence.js";
|
|
4
|
+
import { UseHotkeySequences } from "./useHotkeySequences.js";
|
|
5
|
+
import { useHeldKeys } from "./useHeldKeys.js";
|
|
6
|
+
import { useHeldKeyCodes } from "./useHeldKeyCodes.js";
|
|
7
|
+
import { useKeyHold } from "./useKeyHold.js";
|
|
8
|
+
import { useHotkeyHint } from "./useHotkeyHint.js";
|
|
9
|
+
import { useHotkeyRegistrations } from "./useHotkeyRegistrations.js";
|
|
10
|
+
import { useHotkeyRecorder } from "./useHotkeyRecorder.js";
|
|
11
|
+
import { useHotkeySequenceRecorder } from "./useHotkeySequenceRecorder.js";
|
|
12
|
+
import { OnHotkey } from "./onHotkey.js";
|
|
13
|
+
import { OnHotkeys } from "./onHotkeys.js";
|
|
14
|
+
import { createHotkeysScope } from "./createHotkeysScope.js";
|
|
15
|
+
|
|
16
|
+
export * from "@tanstack/hotkeys"
|
|
17
|
+
|
|
18
|
+
export { createHotkeysScope, OnHotkey as onHotkey, OnHotkeys as onHotkeys, useHeldKeyCodes, useHeldKeys, UseHotkey as useHotkey, useHotkeyHint, useHotkeyRecorder, useHotkeyRegistrations, UseHotkeySequence as useHotkeySequence, useHotkeySequenceRecorder, UseHotkeySequences as useHotkeySequences, UseHotkeys as useHotkeys, useKeyHold };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { ElementHotkeyOptions } from "./onHotkeys.js";
|
|
2
|
+
import { HotkeyCallback, RegisterableHotkey } from "@tanstack/hotkeys";
|
|
3
|
+
import Modifier from "ember-modifier";
|
|
4
|
+
//#region src/onHotkey.d.ts
|
|
5
|
+
/** Attaches a shortcut to the element that owns the modifier. */
|
|
6
|
+
export declare class OnHotkey extends Modifier<{
|
|
7
|
+
Element: HTMLElement;
|
|
8
|
+
Args: {
|
|
9
|
+
Positional: [RegisterableHotkey, HotkeyCallback];
|
|
10
|
+
Named: ElementHotkeyOptions;
|
|
11
|
+
};
|
|
12
|
+
}> {
|
|
13
|
+
private bindings;
|
|
14
|
+
private definition;
|
|
15
|
+
private cleanup;
|
|
16
|
+
modify(element: HTMLElement, [hotkey, callback]: [RegisterableHotkey, HotkeyCallback], options: ElementHotkeyOptions): void;
|
|
17
|
+
private update;
|
|
18
|
+
}
|
|
19
|
+
//#endregion
|
package/dist/onHotkey.js
ADDED
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { isDestroyed, isDestroying, registerDestructor } from "@ember/destroyable";
|
|
2
|
+
import { scheduleOnce } from "@ember/runloop";
|
|
3
|
+
import { createHotkeyBindings } from "@tanstack/hotkeys/adapter";
|
|
4
|
+
import Modifier from "ember-modifier";
|
|
5
|
+
|
|
6
|
+
//#region src/onHotkey.ts
|
|
7
|
+
/** Attaches a shortcut to the element that owns the modifier. */
|
|
8
|
+
var OnHotkey = class extends Modifier {
|
|
9
|
+
bindings = createHotkeyBindings();
|
|
10
|
+
definition;
|
|
11
|
+
cleanup = registerDestructor(this, () => this.bindings.destroy());
|
|
12
|
+
modify(element, [hotkey, callback], options) {
|
|
13
|
+
this.cleanup;
|
|
14
|
+
this.definition = {
|
|
15
|
+
hotkey: typeof hotkey === "string" ? hotkey : { ...hotkey },
|
|
16
|
+
callback,
|
|
17
|
+
options: {
|
|
18
|
+
...options,
|
|
19
|
+
target: element
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
scheduleOnce("afterRender", this, this.update);
|
|
23
|
+
}
|
|
24
|
+
update() {
|
|
25
|
+
if (this.definition && !isDestroying(this) && !isDestroyed(this)) this.bindings.update([this.definition]);
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
//#endregion
|
|
30
|
+
export { OnHotkey };
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { HotkeyOptions } from "@tanstack/hotkeys";
|
|
2
|
+
import { HotkeyDefinition } from "@tanstack/hotkeys/adapter";
|
|
3
|
+
import Modifier from "ember-modifier";
|
|
4
|
+
//#region src/onHotkeys.d.ts
|
|
5
|
+
/** Options for a modifier whose target is always its containing element. */
|
|
6
|
+
export type ElementHotkeyOptions = Omit<HotkeyOptions, 'target'>;
|
|
7
|
+
/** Attach a reactive list of shortcuts directly to an element. */
|
|
8
|
+
export declare class OnHotkeys extends Modifier<{
|
|
9
|
+
Element: HTMLElement;
|
|
10
|
+
Args: {
|
|
11
|
+
Positional: [Array<HotkeyDefinition>];
|
|
12
|
+
Named: ElementHotkeyOptions;
|
|
13
|
+
};
|
|
14
|
+
}> {
|
|
15
|
+
private bindings;
|
|
16
|
+
private definitions;
|
|
17
|
+
private options;
|
|
18
|
+
private cleanup;
|
|
19
|
+
modify(element: HTMLElement, [definitions]: [Array<HotkeyDefinition>], options: ElementHotkeyOptions): void;
|
|
20
|
+
private update;
|
|
21
|
+
}
|
|
22
|
+
//#endregion
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { isDestroyed, isDestroying, registerDestructor } from "@ember/destroyable";
|
|
2
|
+
import { scheduleOnce } from "@ember/runloop";
|
|
3
|
+
import { createHotkeyBindings } from "@tanstack/hotkeys/adapter";
|
|
4
|
+
import Modifier from "ember-modifier";
|
|
5
|
+
|
|
6
|
+
//#region src/onHotkeys.ts
|
|
7
|
+
/** Attach a reactive list of shortcuts directly to an element. */
|
|
8
|
+
var OnHotkeys = class extends Modifier {
|
|
9
|
+
bindings = createHotkeyBindings();
|
|
10
|
+
definitions = [];
|
|
11
|
+
options = {};
|
|
12
|
+
cleanup = registerDestructor(this, () => this.bindings.destroy());
|
|
13
|
+
modify(element, [definitions], options) {
|
|
14
|
+
this.cleanup;
|
|
15
|
+
this.definitions = definitions.map((definition) => ({
|
|
16
|
+
...definition,
|
|
17
|
+
hotkey: typeof definition.hotkey === "string" ? definition.hotkey : { ...definition.hotkey },
|
|
18
|
+
options: {
|
|
19
|
+
...definition.options,
|
|
20
|
+
target: element
|
|
21
|
+
}
|
|
22
|
+
}));
|
|
23
|
+
this.options = {
|
|
24
|
+
...options,
|
|
25
|
+
target: element
|
|
26
|
+
};
|
|
27
|
+
scheduleOnce("afterRender", this, this.update);
|
|
28
|
+
}
|
|
29
|
+
update() {
|
|
30
|
+
if (!isDestroying(this) && !isDestroyed(this)) this.bindings.update(this.definitions, this.options);
|
|
31
|
+
}
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
//#endregion
|
|
35
|
+
export { OnHotkeys };
|
package/dist/types.d.ts
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { Hotkey, HotkeyOptions, HotkeyRecorderOptions, HotkeyRegistrationView, HotkeySequence, HotkeySequenceRecorderOptions, SequenceOptions, SequenceRegistrationView } from "@tanstack/hotkeys";
|
|
2
|
+
//#region src/types.d.ts
|
|
3
|
+
/** A reactive value. Read `.value` where the framework tracks dependencies. */
|
|
4
|
+
export interface EmberHotkeyState<T> {
|
|
5
|
+
readonly value: T;
|
|
6
|
+
}
|
|
7
|
+
/** Recording state and controls owned by the containing component. */
|
|
8
|
+
export interface EmberHotkeyRecorder {
|
|
9
|
+
/** Whether the recorder is listening for a shortcut. */
|
|
10
|
+
readonly isRecording: boolean;
|
|
11
|
+
/** The last recorded binding, including brackets for physical codes. */
|
|
12
|
+
readonly recordedHotkey: Hotkey | null;
|
|
13
|
+
/** Start a new recording session. */
|
|
14
|
+
startRecording: () => void;
|
|
15
|
+
/** Stop and clear recorder state without calling onRecord or onCancel. */
|
|
16
|
+
stopRecording: () => void;
|
|
17
|
+
/** Stop, clear recorder state, and call onCancel. */
|
|
18
|
+
cancelRecording: () => void;
|
|
19
|
+
}
|
|
20
|
+
/** Sequence recording state and controls. */
|
|
21
|
+
export interface EmberHotkeySequenceRecorder {
|
|
22
|
+
/** Whether the recorder is listening for chords. */
|
|
23
|
+
readonly isRecording: boolean;
|
|
24
|
+
/** Chords captured in the current session. */
|
|
25
|
+
readonly steps: HotkeySequence;
|
|
26
|
+
/** The last committed sequence. */
|
|
27
|
+
readonly recordedSequence: HotkeySequence | null;
|
|
28
|
+
/** Start a new recording session. */
|
|
29
|
+
startRecording: () => void;
|
|
30
|
+
/** Stop without committing or calling onCancel. */
|
|
31
|
+
stopRecording: () => void;
|
|
32
|
+
/** Discard the current session and call onCancel. */
|
|
33
|
+
cancelRecording: () => void;
|
|
34
|
+
/** Commit the current steps. Does nothing when no steps are recorded. */
|
|
35
|
+
commitRecording: () => void;
|
|
36
|
+
}
|
|
37
|
+
/** Live registration views from the shared hotkey and sequence managers. */
|
|
38
|
+
export interface HotkeyRegistrationsResult {
|
|
39
|
+
readonly hotkeys: Array<HotkeyRegistrationView>;
|
|
40
|
+
readonly sequences: Array<SequenceRegistrationView>;
|
|
41
|
+
}
|
|
42
|
+
/** Shared defaults; call-specific options take precedence. */
|
|
43
|
+
export interface DefaultHotkeysOptions {
|
|
44
|
+
hotkey?: HotkeyOptions;
|
|
45
|
+
hotkeySequence?: SequenceOptions;
|
|
46
|
+
hotkeyRecorder?: Partial<HotkeyRecorderOptions>;
|
|
47
|
+
hotkeySequenceRecorder?: Partial<HotkeySequenceRecorderOptions>;
|
|
48
|
+
}
|
|
49
|
+
//#endregion
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { select } from "./utils.js";
|
|
2
|
+
import { getKeyStateTracker } from "@tanstack/hotkeys";
|
|
3
|
+
|
|
4
|
+
//#region src/useHeldKeyCodes.ts
|
|
5
|
+
/** Reads physical key codes through Ember autotracking. */
|
|
6
|
+
function useHeldKeyCodes(owner) {
|
|
7
|
+
return select(owner, getKeyStateTracker().store, (state) => state.heldCodes);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
//#endregion
|
|
11
|
+
export { useHeldKeyCodes };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { EmberHotkeyState } from "./types.js";
|
|
2
|
+
//#region src/useHeldKeys.d.ts
|
|
3
|
+
/** Pass the containing component as owner to release the subscription on destruction. */
|
|
4
|
+
export declare function useHeldKeys(owner: object): EmberHotkeyState<Array<string>>;
|
|
5
|
+
//#endregion
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { select } from "./utils.js";
|
|
2
|
+
import { getKeyStateTracker } from "@tanstack/hotkeys";
|
|
3
|
+
|
|
4
|
+
//#region src/useHeldKeys.ts
|
|
5
|
+
/** Pass the containing component as owner to release the subscription on destruction. */
|
|
6
|
+
function useHeldKeys(owner) {
|
|
7
|
+
return select(owner, getKeyStateTracker().store, (state) => state.heldKeys);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
//#endregion
|
|
11
|
+
export { useHeldKeys };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { HotkeyCallback, HotkeyOptions, RegisterableHotkey } from "@tanstack/hotkeys";
|
|
2
|
+
import Helper from "@ember/component/helper";
|
|
3
|
+
//#region src/useHotkey.d.ts
|
|
4
|
+
/** Use {{useHotkey "Mod+S" this.save enabled=this.enabled}} in a template. */
|
|
5
|
+
export declare class UseHotkey extends Helper<{
|
|
6
|
+
Args: {
|
|
7
|
+
Positional: [RegisterableHotkey, HotkeyCallback];
|
|
8
|
+
Named: HotkeyOptions;
|
|
9
|
+
};
|
|
10
|
+
Return: void;
|
|
11
|
+
}> {
|
|
12
|
+
private bindings;
|
|
13
|
+
private definition;
|
|
14
|
+
private cleanup;
|
|
15
|
+
compute([hotkey, callback]: [RegisterableHotkey, HotkeyCallback], options: HotkeyOptions): void;
|
|
16
|
+
private update;
|
|
17
|
+
}
|
|
18
|
+
//#endregion
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import Helper from "@ember/component/helper";
|
|
2
|
+
import { isDestroyed, isDestroying, registerDestructor } from "@ember/destroyable";
|
|
3
|
+
import { scheduleOnce } from "@ember/runloop";
|
|
4
|
+
import { createHotkeyBindings } from "@tanstack/hotkeys/adapter";
|
|
5
|
+
|
|
6
|
+
//#region src/useHotkey.ts
|
|
7
|
+
/** Use {{useHotkey "Mod+S" this.save enabled=this.enabled}} in a template. */
|
|
8
|
+
var UseHotkey = class extends Helper {
|
|
9
|
+
bindings = createHotkeyBindings();
|
|
10
|
+
definition;
|
|
11
|
+
cleanup = registerDestructor(this, () => this.bindings.destroy());
|
|
12
|
+
compute([hotkey, callback], options) {
|
|
13
|
+
this.cleanup;
|
|
14
|
+
this.definition = {
|
|
15
|
+
hotkey: typeof hotkey === "string" ? hotkey : { ...hotkey },
|
|
16
|
+
callback,
|
|
17
|
+
options: { ...options }
|
|
18
|
+
};
|
|
19
|
+
scheduleOnce("afterRender", this, this.update);
|
|
20
|
+
}
|
|
21
|
+
update() {
|
|
22
|
+
if (this.definition && !isDestroying(this) && !isDestroyed(this)) this.bindings.update([this.definition]);
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
//#endregion
|
|
27
|
+
export { UseHotkey };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MaybeGetter } from "./utils.js";
|
|
2
|
+
import { EmberHotkeyState } from "./types.js";
|
|
3
|
+
import { HeldModifierOptions, RegisterableHotkey } from "@tanstack/hotkeys";
|
|
4
|
+
//#region src/useHotkeyHint.d.ts
|
|
5
|
+
/** Recomputes for held modifiers and tracked changes to the binding or options. */
|
|
6
|
+
export declare function useHotkeyHint(owner: object, hotkey: MaybeGetter<RegisterableHotkey>, options?: MaybeGetter<HeldModifierOptions>): EmberHotkeyState<boolean>;
|
|
7
|
+
//#endregion
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { read, select } from "./utils.js";
|
|
2
|
+
import { getKeyStateTracker, matchesHeldModifiers } from "@tanstack/hotkeys";
|
|
3
|
+
|
|
4
|
+
//#region src/useHotkeyHint.ts
|
|
5
|
+
/** Recomputes for held modifiers and tracked changes to the binding or options. */
|
|
6
|
+
function useHotkeyHint(owner, hotkey, options = {}) {
|
|
7
|
+
return select(owner, getKeyStateTracker().store, (state) => matchesHeldModifiers(read(hotkey), state.heldKeys, read(options)));
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
//#endregion
|
|
11
|
+
export { useHotkeyHint };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MaybeGetter } from "./utils.js";
|
|
2
|
+
import { EmberHotkeyRecorder } from "./types.js";
|
|
3
|
+
import { HotkeyRecorderOptions } from "@tanstack/hotkeys";
|
|
4
|
+
//#region src/useHotkeyRecorder.d.ts
|
|
5
|
+
/** Creates an owned recorder with autotracked state and current callback options. */
|
|
6
|
+
export declare function useHotkeyRecorder(owner: object, options: MaybeGetter<HotkeyRecorderOptions>): EmberHotkeyRecorder;
|
|
7
|
+
//#endregion
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { read, select } from "./utils.js";
|
|
2
|
+
import { HotkeyRecorder } from "@tanstack/hotkeys";
|
|
3
|
+
import { isDestroyed, isDestroying, registerDestructor } from "@ember/destroyable";
|
|
4
|
+
|
|
5
|
+
//#region src/useHotkeyRecorder.ts
|
|
6
|
+
/** Creates an owned recorder with autotracked state and current callback options. */
|
|
7
|
+
function useHotkeyRecorder(owner, options) {
|
|
8
|
+
const recorder = new HotkeyRecorder(() => read(options));
|
|
9
|
+
const state = select(owner, recorder.store, (value) => value);
|
|
10
|
+
registerDestructor(owner, () => recorder.destroy());
|
|
11
|
+
return {
|
|
12
|
+
get isRecording() {
|
|
13
|
+
return state.value.isRecording;
|
|
14
|
+
},
|
|
15
|
+
get recordedHotkey() {
|
|
16
|
+
return state.value.recordedHotkey;
|
|
17
|
+
},
|
|
18
|
+
startRecording() {
|
|
19
|
+
if (isDestroying(owner) || isDestroyed(owner)) return;
|
|
20
|
+
recorder.start();
|
|
21
|
+
},
|
|
22
|
+
stopRecording: () => recorder.stop(),
|
|
23
|
+
cancelRecording: () => recorder.cancel()
|
|
24
|
+
};
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
//#endregion
|
|
28
|
+
export { useHotkeyRecorder };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { HotkeyRegistrationsResult } from "./types.js";
|
|
2
|
+
//#region src/useHotkeyRegistrations.d.ts
|
|
3
|
+
/** Reads public snapshots of hotkey and sequence registrations. */
|
|
4
|
+
export declare function useHotkeyRegistrations(owner: object): HotkeyRegistrationsResult;
|
|
5
|
+
//#endregion
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { select } from "./utils.js";
|
|
2
|
+
import { getHotkeyManager, getSequenceManager, toHotkeyRegistrationView } from "@tanstack/hotkeys";
|
|
3
|
+
|
|
4
|
+
//#region src/useHotkeyRegistrations.ts
|
|
5
|
+
/** Reads public snapshots of hotkey and sequence registrations. */
|
|
6
|
+
function useHotkeyRegistrations(owner) {
|
|
7
|
+
const hotkeys = select(owner, getHotkeyManager().registrations, (state) => Array.from(state.values()).map(toHotkeyRegistrationView));
|
|
8
|
+
const sequences = select(owner, getSequenceManager().registrations, (state) => Array.from(state.values()));
|
|
9
|
+
return {
|
|
10
|
+
get hotkeys() {
|
|
11
|
+
return hotkeys.value;
|
|
12
|
+
},
|
|
13
|
+
get sequences() {
|
|
14
|
+
return sequences.value;
|
|
15
|
+
}
|
|
16
|
+
};
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
//#endregion
|
|
20
|
+
export { useHotkeyRegistrations };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { HotkeyCallback, HotkeySequence, SequenceOptions } from "@tanstack/hotkeys";
|
|
2
|
+
import Helper from "@ember/component/helper";
|
|
3
|
+
//#region src/useHotkeySequence.d.ts
|
|
4
|
+
/** Use {{useHotkeySequence this.sequence this.run}} in a template. */
|
|
5
|
+
export declare class UseHotkeySequence extends Helper<{
|
|
6
|
+
Args: {
|
|
7
|
+
Positional: [HotkeySequence, HotkeyCallback];
|
|
8
|
+
Named: SequenceOptions;
|
|
9
|
+
};
|
|
10
|
+
Return: void;
|
|
11
|
+
}> {
|
|
12
|
+
private bindings;
|
|
13
|
+
private definition;
|
|
14
|
+
private cleanup;
|
|
15
|
+
compute([sequence, callback]: [HotkeySequence, HotkeyCallback], options: SequenceOptions): void;
|
|
16
|
+
private update;
|
|
17
|
+
}
|
|
18
|
+
//#endregion
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import Helper from "@ember/component/helper";
|
|
2
|
+
import { isDestroyed, isDestroying, registerDestructor } from "@ember/destroyable";
|
|
3
|
+
import { scheduleOnce } from "@ember/runloop";
|
|
4
|
+
import { createHotkeySequenceBindings } from "@tanstack/hotkeys/adapter";
|
|
5
|
+
|
|
6
|
+
//#region src/useHotkeySequence.ts
|
|
7
|
+
/** Use {{useHotkeySequence this.sequence this.run}} in a template. */
|
|
8
|
+
var UseHotkeySequence = class extends Helper {
|
|
9
|
+
bindings = createHotkeySequenceBindings();
|
|
10
|
+
definition;
|
|
11
|
+
cleanup = registerDestructor(this, () => this.bindings.destroy());
|
|
12
|
+
compute([sequence, callback], options) {
|
|
13
|
+
this.cleanup;
|
|
14
|
+
this.definition = {
|
|
15
|
+
sequence: [...sequence],
|
|
16
|
+
callback,
|
|
17
|
+
options: { ...options }
|
|
18
|
+
};
|
|
19
|
+
scheduleOnce("afterRender", this, this.update);
|
|
20
|
+
}
|
|
21
|
+
update() {
|
|
22
|
+
if (this.definition && !isDestroying(this) && !isDestroyed(this)) this.bindings.update([this.definition]);
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
//#endregion
|
|
27
|
+
export { UseHotkeySequence };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MaybeGetter } from "./utils.js";
|
|
2
|
+
import { EmberHotkeySequenceRecorder } from "./types.js";
|
|
3
|
+
import { HotkeySequenceRecorderOptions } from "@tanstack/hotkeys";
|
|
4
|
+
//#region src/useHotkeySequenceRecorder.d.ts
|
|
5
|
+
/** Creates an owned sequence recorder with explicit commit and cancel controls. */
|
|
6
|
+
export declare function useHotkeySequenceRecorder(owner: object, options: MaybeGetter<HotkeySequenceRecorderOptions>): EmberHotkeySequenceRecorder;
|
|
7
|
+
//#endregion
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { read, select } from "./utils.js";
|
|
2
|
+
import { HotkeySequenceRecorder } from "@tanstack/hotkeys";
|
|
3
|
+
import { isDestroyed, isDestroying, registerDestructor } from "@ember/destroyable";
|
|
4
|
+
|
|
5
|
+
//#region src/useHotkeySequenceRecorder.ts
|
|
6
|
+
/** Creates an owned sequence recorder with explicit commit and cancel controls. */
|
|
7
|
+
function useHotkeySequenceRecorder(owner, options) {
|
|
8
|
+
const recorder = new HotkeySequenceRecorder(() => read(options));
|
|
9
|
+
const state = select(owner, recorder.store, (value) => value);
|
|
10
|
+
registerDestructor(owner, () => recorder.destroy());
|
|
11
|
+
return {
|
|
12
|
+
get isRecording() {
|
|
13
|
+
return state.value.isRecording;
|
|
14
|
+
},
|
|
15
|
+
get steps() {
|
|
16
|
+
return state.value.steps;
|
|
17
|
+
},
|
|
18
|
+
get recordedSequence() {
|
|
19
|
+
return state.value.recordedSequence;
|
|
20
|
+
},
|
|
21
|
+
startRecording() {
|
|
22
|
+
if (isDestroying(owner) || isDestroyed(owner)) return;
|
|
23
|
+
recorder.start();
|
|
24
|
+
},
|
|
25
|
+
stopRecording: () => recorder.stop(),
|
|
26
|
+
cancelRecording: () => recorder.cancel(),
|
|
27
|
+
commitRecording: () => recorder.commit()
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
//#endregion
|
|
32
|
+
export { useHotkeySequenceRecorder };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { SequenceOptions } from "@tanstack/hotkeys";
|
|
2
|
+
import Helper from "@ember/component/helper";
|
|
3
|
+
import { HotkeySequenceDefinition } from "@tanstack/hotkeys/adapter";
|
|
4
|
+
//#region src/useHotkeySequences.d.ts
|
|
5
|
+
/** Registers a reactive list of sequences with the helper's template lifecycle. */
|
|
6
|
+
export declare class UseHotkeySequences extends Helper<{
|
|
7
|
+
Args: {
|
|
8
|
+
Positional: [Array<HotkeySequenceDefinition>];
|
|
9
|
+
Named: SequenceOptions;
|
|
10
|
+
};
|
|
11
|
+
Return: void;
|
|
12
|
+
}> {
|
|
13
|
+
private bindings;
|
|
14
|
+
private definitions;
|
|
15
|
+
private options;
|
|
16
|
+
private cleanup;
|
|
17
|
+
compute([definitions]: [Array<HotkeySequenceDefinition>], options: SequenceOptions): void;
|
|
18
|
+
private update;
|
|
19
|
+
}
|
|
20
|
+
//#endregion
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import Helper from "@ember/component/helper";
|
|
2
|
+
import { isDestroyed, isDestroying, registerDestructor } from "@ember/destroyable";
|
|
3
|
+
import { scheduleOnce } from "@ember/runloop";
|
|
4
|
+
import { createHotkeySequenceBindings } from "@tanstack/hotkeys/adapter";
|
|
5
|
+
|
|
6
|
+
//#region src/useHotkeySequences.ts
|
|
7
|
+
/** Registers a reactive list of sequences with the helper's template lifecycle. */
|
|
8
|
+
var UseHotkeySequences = class extends Helper {
|
|
9
|
+
bindings = createHotkeySequenceBindings();
|
|
10
|
+
definitions = [];
|
|
11
|
+
options = {};
|
|
12
|
+
cleanup = registerDestructor(this, () => this.bindings.destroy());
|
|
13
|
+
compute([definitions], options) {
|
|
14
|
+
this.cleanup;
|
|
15
|
+
this.definitions = definitions.map((definition) => ({
|
|
16
|
+
...definition,
|
|
17
|
+
sequence: [...definition.sequence],
|
|
18
|
+
options: { ...definition.options }
|
|
19
|
+
}));
|
|
20
|
+
this.options = { ...options };
|
|
21
|
+
scheduleOnce("afterRender", this, this.update);
|
|
22
|
+
}
|
|
23
|
+
update() {
|
|
24
|
+
if (!isDestroying(this) && !isDestroyed(this)) this.bindings.update(this.definitions, this.options);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
//#endregion
|
|
29
|
+
export { UseHotkeySequences };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { HotkeyOptions } from "@tanstack/hotkeys";
|
|
2
|
+
import Helper from "@ember/component/helper";
|
|
3
|
+
import { HotkeyDefinition } from "@tanstack/hotkeys/adapter";
|
|
4
|
+
//#region src/useHotkeys.d.ts
|
|
5
|
+
/** Registers a reactive list of shortcuts with the helper's template lifecycle. */
|
|
6
|
+
export declare class UseHotkeys extends Helper<{
|
|
7
|
+
Args: {
|
|
8
|
+
Positional: [Array<HotkeyDefinition>];
|
|
9
|
+
Named: HotkeyOptions;
|
|
10
|
+
};
|
|
11
|
+
Return: void;
|
|
12
|
+
}> {
|
|
13
|
+
private bindings;
|
|
14
|
+
private definitions;
|
|
15
|
+
private options;
|
|
16
|
+
private cleanup;
|
|
17
|
+
compute([definitions]: [Array<HotkeyDefinition>], options: HotkeyOptions): void;
|
|
18
|
+
private update;
|
|
19
|
+
}
|
|
20
|
+
//#endregion
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import Helper from "@ember/component/helper";
|
|
2
|
+
import { isDestroyed, isDestroying, registerDestructor } from "@ember/destroyable";
|
|
3
|
+
import { scheduleOnce } from "@ember/runloop";
|
|
4
|
+
import { createHotkeyBindings } from "@tanstack/hotkeys/adapter";
|
|
5
|
+
|
|
6
|
+
//#region src/useHotkeys.ts
|
|
7
|
+
/** Registers a reactive list of shortcuts with the helper's template lifecycle. */
|
|
8
|
+
var UseHotkeys = class extends Helper {
|
|
9
|
+
bindings = createHotkeyBindings();
|
|
10
|
+
definitions = [];
|
|
11
|
+
options = {};
|
|
12
|
+
cleanup = registerDestructor(this, () => this.bindings.destroy());
|
|
13
|
+
compute([definitions], options) {
|
|
14
|
+
this.cleanup;
|
|
15
|
+
this.definitions = definitions.map((definition) => ({
|
|
16
|
+
...definition,
|
|
17
|
+
hotkey: typeof definition.hotkey === "string" ? definition.hotkey : { ...definition.hotkey },
|
|
18
|
+
options: { ...definition.options }
|
|
19
|
+
}));
|
|
20
|
+
this.options = { ...options };
|
|
21
|
+
scheduleOnce("afterRender", this, this.update);
|
|
22
|
+
}
|
|
23
|
+
update() {
|
|
24
|
+
if (!isDestroying(this) && !isDestroyed(this)) this.bindings.update(this.definitions, this.options);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
//#endregion
|
|
29
|
+
export { UseHotkeys };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MaybeGetter } from "./utils.js";
|
|
2
|
+
import { EmberHotkeyState } from "./types.js";
|
|
3
|
+
import { IndividualKey } from "@tanstack/hotkeys";
|
|
4
|
+
//#region src/useKeyHold.d.ts
|
|
5
|
+
/** Getter arguments can read changing tracked component properties. */
|
|
6
|
+
export declare function useKeyHold(owner: object, key: MaybeGetter<IndividualKey>): EmberHotkeyState<boolean>;
|
|
7
|
+
//#endregion
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { read, select } from "./utils.js";
|
|
2
|
+
import { getKeyStateTracker } from "@tanstack/hotkeys";
|
|
3
|
+
|
|
4
|
+
//#region src/useKeyHold.ts
|
|
5
|
+
/** Getter arguments can read changing tracked component properties. */
|
|
6
|
+
function useKeyHold(owner, key) {
|
|
7
|
+
return select(owner, getKeyStateTracker().store, (state) => state.heldKeys.includes(read(key)));
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
//#endregion
|
|
11
|
+
export { useKeyHold };
|
package/dist/utils.d.ts
ADDED
package/dist/utils.js
ADDED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { registerDestructor } from "@ember/destroyable";
|
|
2
|
+
import { trackedObject } from "@ember/reactive/collections";
|
|
3
|
+
|
|
4
|
+
//#region src/utils.ts
|
|
5
|
+
function read(value) {
|
|
6
|
+
return typeof value === "function" ? value() : value;
|
|
7
|
+
}
|
|
8
|
+
function select(owner, store, selector) {
|
|
9
|
+
const state = trackedObject({ snapshot: store.state });
|
|
10
|
+
const subscription = store.subscribe(() => {
|
|
11
|
+
state.snapshot = store.state;
|
|
12
|
+
});
|
|
13
|
+
registerDestructor(owner, () => subscription.unsubscribe());
|
|
14
|
+
return { get value() {
|
|
15
|
+
return selector(state.snapshot);
|
|
16
|
+
} };
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
//#endregion
|
|
20
|
+
export { read, select };
|
package/package.json
ADDED
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@tanstack/ember-hotkeys",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "Ember adapter for TanStack Hotkeys",
|
|
5
|
+
"author": "Tanner Linsley",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"repository": {
|
|
8
|
+
"type": "git",
|
|
9
|
+
"url": "git+https://github.com/TanStack/hotkeys.git",
|
|
10
|
+
"directory": "packages/ember-hotkeys"
|
|
11
|
+
},
|
|
12
|
+
"homepage": "https://tanstack.com/hotkeys",
|
|
13
|
+
"funding": {
|
|
14
|
+
"type": "github",
|
|
15
|
+
"url": "https://github.com/sponsors/tannerlinsley"
|
|
16
|
+
},
|
|
17
|
+
"keywords": [
|
|
18
|
+
"ember",
|
|
19
|
+
"tanstack",
|
|
20
|
+
"hotkeys"
|
|
21
|
+
],
|
|
22
|
+
"scripts": {
|
|
23
|
+
"clean": "premove ./build ./dist ./dist-tests",
|
|
24
|
+
"lint": "eslint ./src",
|
|
25
|
+
"lint:fix": "eslint ./src --fix",
|
|
26
|
+
"test:eslint": "eslint ./src",
|
|
27
|
+
"test:lib": "vite build --mode=development --out-dir dist-tests && testem --file testem.cjs ci --port 0",
|
|
28
|
+
"test:lib:dev": "pnpm test:lib --watch",
|
|
29
|
+
"test:types": "ember-tsc --noEmit",
|
|
30
|
+
"build": "tsdown",
|
|
31
|
+
"test:build": "publint --strict && node ../../scripts/verify-package.ts"
|
|
32
|
+
},
|
|
33
|
+
"type": "module",
|
|
34
|
+
"types": "./dist/index.d.ts",
|
|
35
|
+
"exports": {
|
|
36
|
+
".": "./dist/index.js",
|
|
37
|
+
"./package.json": "./package.json",
|
|
38
|
+
"./addon-main.js": "./addon-main.cjs"
|
|
39
|
+
},
|
|
40
|
+
"sideEffects": [
|
|
41
|
+
"./tests/**"
|
|
42
|
+
],
|
|
43
|
+
"engines": {
|
|
44
|
+
"node": ">=20"
|
|
45
|
+
},
|
|
46
|
+
"files": [
|
|
47
|
+
"dist",
|
|
48
|
+
"addon-main.cjs"
|
|
49
|
+
],
|
|
50
|
+
"dependencies": {
|
|
51
|
+
"@embroider/addon-shim": "^1.10.3",
|
|
52
|
+
"@tanstack/hotkeys": "workspace:*",
|
|
53
|
+
"@tanstack/store": "^0.11.2",
|
|
54
|
+
"ember-modifier": "4.2.2"
|
|
55
|
+
},
|
|
56
|
+
"devDependencies": {
|
|
57
|
+
"@babel/core": "7.29.7",
|
|
58
|
+
"@babel/plugin-transform-typescript": "7.29.9",
|
|
59
|
+
"@ember/app-tsconfig": "2.1.0",
|
|
60
|
+
"@ember/test-helpers": "^5.7.0",
|
|
61
|
+
"@embroider/core": "4.6.7",
|
|
62
|
+
"@embroider/macros": "1.21.1",
|
|
63
|
+
"@embroider/vite": "^1.7.13",
|
|
64
|
+
"@glimmer/component": "2.1.1",
|
|
65
|
+
"@glint/ember-tsc": "1.11.6",
|
|
66
|
+
"@glint/template": "1.9.0",
|
|
67
|
+
"@glint/tsserver-plugin": "2.7.9",
|
|
68
|
+
"@rollup/plugin-babel": "7.1.0",
|
|
69
|
+
"@types/qunit": "^2.19.14",
|
|
70
|
+
"babel-plugin-ember-template-compilation": "4.0.0",
|
|
71
|
+
"decorator-transforms": "2.4.0",
|
|
72
|
+
"ember-qunit": "^9.2.0",
|
|
73
|
+
"ember-source": "7.3.0",
|
|
74
|
+
"ember-strict-application-resolver": "0.1.1",
|
|
75
|
+
"qunit": "^3.0.0",
|
|
76
|
+
"qunit-dom": "^3.6.0",
|
|
77
|
+
"testem": "^3.21.3",
|
|
78
|
+
"vite": "^8.3.2"
|
|
79
|
+
},
|
|
80
|
+
"peerDependencies": {
|
|
81
|
+
"ember-source": ">=6.8.0"
|
|
82
|
+
},
|
|
83
|
+
"ember-addon": {
|
|
84
|
+
"version": 2,
|
|
85
|
+
"type": "addon",
|
|
86
|
+
"main": "addon-main.cjs"
|
|
87
|
+
},
|
|
88
|
+
"nx": {
|
|
89
|
+
"targets": {
|
|
90
|
+
"test:lib": {
|
|
91
|
+
"dependsOn": [
|
|
92
|
+
"build",
|
|
93
|
+
"^build"
|
|
94
|
+
]
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
}
|