Comments (4)
I think this is a great plan going forward and I've added it to the v2 tracking issue #65!
One quibble I'd make with this API though is around the naming of processHotkey
vs processExpansion
. There are indeed these two serializers, however I would change the names:
- During
installation
we read thedata-hotkey
value and store that internally (in a trie). I would call this functionprocessHotkey
. - When handling events, we need to serialize the event into a string to compare to the hotkey trie node: I would call this
processEvent
Notice that these names align with the function argument names you have already proposed.
I also wonder if we want to use a class approach: One concern I have with the class approach is that I would expect that state would be managed in the class instance, but we currently manage state in module-scoped private variables.
I think we could continue with a functional approach, but pass a config object to the install
command. I don't think the uninstall command depends on processHotkey
or processEvent
.
The API, then could be
export type ProcessHotkey = (hotkey: string): string[][]
export type ProcessEvent = (event: KeyboardEvent): string
export interface HotkeyOptions {
hotkey?: string;
processHotkey: ProcessHotkey;
processEvent: ProcessEvent;
}
export function install(
element: HTMLelement,
options = {
hotkey,
processHotkey: expandHotkeyToEdges,
processEvent: eventToHotkeyString;
}: HotkeyOptions
): void {}
export function uninstall(element: HTMLElement): void {}
This would almost not even be a breaking change — except I had to move the optional hotkey
argument to install
into the HotkeyOptions
.
Anyways, I am okay with either approach in the end: just thought I would throw this option out there.
from hotkey.
One quibble I'd make with this API though is around the naming of
processHotkey
vsprocessExpansion
Your suggestion here LGTM 👍
I think we could continue with a functional approach, but pass a config object to the
install
command
The problem with that proposal is less to do with uninstall
and more to do with the internalizing of the processors in respect to stored state. Having a functional approach where users can change what processHotkey
and processExpansion
across multiple install calls leaves issues with how Leafs are processed in the radix trie, and how event delegation would work. Another way to say this is that each combination of processHotkey
+processExpansion
needs its own event manager/radix trie.
from hotkey.
Having a functional approach where users can change what
processHotkey
andprocessExpansion
across multiple install calls leaves issues with how Leafs are processed in the radix trie, and how event delegation would work.
Yeah! I totally agree with this. I am onboard with the class.
from hotkey.
(I updated the code in your description with the changed processor names)
from hotkey.
Related Issues (20)
- Hotkeys are fired when trying to type into a text field inside a custom element HOT 4
- Add support for class-name as `data-hotkey-scope`
- Add a special `Mod` character that translates to either `Meta` on Mac or `Control` on other platforms HOT 2
- Handle keypresses in elements with dotted ids HOT 1
- `eventToHotkeyString ` returns doubled "modifier" when "key" is a modifier
- Hotkey Mapper Tool accessibility improvements HOT 4
- Hotkey version 2 HOT 1
- Release action fails on publish to npm HOT 2
- `eventToHotKey` inconsistent `alt` key behaviour on Mac
- TypeError: Cannot read properties of undefined (reading 'startsWith')
- Hotkey version 3 HOT 4
- Any ways to define which event to fire when hotkey is triggered? HOT 4
- How might I make the user press the shortcut twice before running the keyDownHandler?
- Listen for some hotkeys on form fields
- Uncomment emulator secrets when vault token is minted HOT 1
- The / hotkey does not work HOT 9
- Add support for chords to mapper tool
- Add support for `event.code`
- Expose `hotkey` and `SequenceTracker` components
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hotkey.