@tanstack/hotkeys-devtools 0.2.0 → 0.3.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.
Files changed (17) hide show
  1. package/README.md +2 -1
  2. package/dist/HotkeysContextProvider.js +11 -1
  3. package/dist/HotkeysContextProvider.js.map +1 -1
  4. package/dist/components/ActionButtons.js +7 -2
  5. package/dist/components/ActionButtons.js.map +1 -1
  6. package/dist/components/DetailsPanel.js +458 -215
  7. package/dist/components/DetailsPanel.js.map +1 -1
  8. package/dist/components/HotkeyList.js +294 -139
  9. package/dist/components/HotkeyList.js.map +1 -1
  10. package/dist/components/Shell.js +3 -1
  11. package/dist/components/Shell.js.map +1 -1
  12. package/package.json +2 -2
  13. package/src/HotkeysContextProvider.tsx +31 -3
  14. package/src/components/ActionButtons.tsx +18 -5
  15. package/src/components/DetailsPanel.tsx +500 -204
  16. package/src/components/HotkeyList.tsx +195 -2
  17. package/src/components/Shell.tsx +4 -1
package/dist/components/HotkeyList.js CHANGED
@@ -2,11 +2,14 @@ import { useHotkeysDevtoolsState } from "../HotkeysContextProvider.js";
2
2
  import { useStyles } from "../styles/use-styles.js";
3
3
  import { For, Show, createEffect, createMemo, createSignal, on } from "solid-js";
4
4
  import { className, createComponent, delegateEvents, effect, insert, memo, template } from "solid-js/web";
5
- import { formatForDisplay } from "@tanstack/hotkeys";
5
+ import { formatForDisplay, formatHotkeySequence } from "@tanstack/hotkeys";
6
6
  import clsx from "clsx";
7
7
 
8
8
  //#region src/components/HotkeyList.tsx
9
- var _tmpl$ = /* @__PURE__ */ template(`<div>Hotkeys (<!>)`), _tmpl$2 = /* @__PURE__ */ template(`<div>`), _tmpl$3 = /* @__PURE__ */ template(`<span>x`), _tmpl$4 = /* @__PURE__ */ template(`<div><span></span><div><span><span data-tooltip></span></span><span><span data-tooltip>Fires on <!> event</span></span><span><span data-tooltip>`), _tmpl$5 = /* @__PURE__ */ template(`<span><span data-tooltip>`), _tmpl$6 = /* @__PURE__ */ template(`<span>i<span data-tooltip>`);
9
+ var _tmpl$ = /* @__PURE__ */ template(`<div>Hotkeys (<!>)`), _tmpl$2 = /* @__PURE__ */ template(`<div>`), _tmpl$3 = /* @__PURE__ */ template(`<div>Sequences (<!>)`), _tmpl$4 = /* @__PURE__ */ template(`<span>x`), _tmpl$5 = /* @__PURE__ */ template(`<div><span></span><div><span><span data-tooltip></span></span><span><span data-tooltip>Fires on <!> event</span></span><span><span data-tooltip>`), _tmpl$6 = /* @__PURE__ */ template(`<span><span data-tooltip>`), _tmpl$7 = /* @__PURE__ */ template(`<span>i<span data-tooltip>`);
10
+ function sequenceKey(sequence) {
11
+ return sequence.join("|");
12
+ }
10
13
  function getTargetLabel(target) {
11
14
  if (typeof document !== "undefined" && target === document) return "document";
12
15
  if (typeof window !== "undefined" && target === window) return "window";
@@ -35,151 +38,303 @@ function findTargetConflicts(registration, all) {
35
38
  function findScopeConflicts(registration, all) {
36
39
  return all.filter((other) => other.id !== registration.id && other.hotkey === registration.hotkey && other.options.eventType === registration.options.eventType && other.target !== registration.target);
37
40
  }
41
+ function findSequenceTargetConflicts(registration, all) {
42
+ return all.filter((other) => other.id !== registration.id && sequenceKey(other.sequence) === sequenceKey(registration.sequence) && other.options.eventType === registration.options.eventType && other.target === registration.target);
43
+ }
44
+ function findSequenceScopeConflicts(registration, all) {
45
+ return all.filter((other) => other.id !== registration.id && sequenceKey(other.sequence) === sequenceKey(registration.sequence) && other.options.eventType === registration.options.eventType && other.target !== registration.target);
46
+ }
38
47
  function HotkeyList(props) {
39
48
  const styles = useStyles();
40
49
  const state = useHotkeysDevtoolsState();
41
50
  const registrations = createMemo(() => state.registrations());
42
- return [(() => {
43
- var _el$ = _tmpl$(), _el$4 = _el$.firstChild.nextSibling;
44
- _el$4.nextSibling;
45
- insert(_el$, () => registrations().length, _el$4);
46
- effect(() => className(_el$, styles().panelHeader));
47
- return _el$;
48
- })(), (() => {
49
- var _el$5 = _tmpl$2();
50
- insert(_el$5, createComponent(For, {
51
- get each() {
52
- return registrations();
53
- },
54
- children: (reg) => {
55
- const targetConflicts = () => findTargetConflicts(reg, registrations());
56
- const scopeConflicts = () => findScopeConflicts(reg, registrations());
57
- const hasTargetConflict = () => targetConflicts().length > 0;
58
- const hasScopeConflict = () => scopeConflicts().length > 0;
59
- const conflictBehavior = () => reg.options.conflictBehavior ?? "warn";
60
- const targetConflictBadge = () => {
61
- const behavior = conflictBehavior();
62
- const c = targetConflicts();
63
- if (behavior === "allow") return {
64
- style: "badgeAllow",
65
- label: "~",
66
- tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? "s" : ""} on same key and target (conflictBehavior: allow)`
51
+ const sequenceRegistrations = createMemo(() => state.sequenceRegistrations());
52
+ return [
53
+ (() => {
54
+ var _el$ = _tmpl$(), _el$4 = _el$.firstChild.nextSibling;
55
+ _el$4.nextSibling;
56
+ insert(_el$, () => registrations().length, _el$4);
57
+ effect(() => className(_el$, styles().panelHeader));
58
+ return _el$;
59
+ })(),
60
+ (() => {
61
+ var _el$5 = _tmpl$2();
62
+ insert(_el$5, createComponent(For, {
63
+ get each() {
64
+ return registrations();
65
+ },
66
+ children: (reg) => {
67
+ const targetConflicts = () => findTargetConflicts(reg, registrations());
68
+ const scopeConflicts = () => findScopeConflicts(reg, registrations());
69
+ const hasTargetConflict = () => targetConflicts().length > 0;
70
+ const hasScopeConflict = () => scopeConflicts().length > 0;
71
+ const conflictBehavior = () => reg.options.conflictBehavior ?? "warn";
72
+ const targetConflictBadge = () => {
73
+ const behavior = conflictBehavior();
74
+ const c = targetConflicts();
75
+ if (behavior === "allow") return {
76
+ style: "badgeAllow",
77
+ label: "~",
78
+ tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? "s" : ""} on same key and target (conflictBehavior: allow)`
79
+ };
80
+ if (behavior === "error") return {
81
+ style: "badgeError",
82
+ label: "!",
83
+ tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? "s" : ""} on same key and target (conflictBehavior: error)`
84
+ };
85
+ return {
86
+ style: "badgeConflict",
87
+ label: "!",
88
+ tooltip: `Warning: ${c.length} other binding${c.length > 1 ? "s" : ""} on same key and target`
89
+ };
67
90
  };
68
- if (behavior === "error") return {
69
- style: "badgeError",
70
- label: "!",
71
- tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? "s" : ""} on same key and target (conflictBehavior: error)`
91
+ const scopeConflictTooltip = () => {
92
+ const c = scopeConflicts();
93
+ return `Info: ${c.length} binding${c.length > 1 ? "s" : ""} with same key on different target${c.length > 1 ? "s" : ""}`;
94
+ };
95
+ const enabled = () => reg.options.enabled !== false;
96
+ const triggerCount = () => registrations().find((r) => r.id === reg.id)?.triggerCount ?? reg.triggerCount;
97
+ const [prevCount, setPrevCount] = createSignal(reg.triggerCount);
98
+ const [pulsing, setPulsing] = createSignal(false);
99
+ createEffect(on(triggerCount, (current) => {
100
+ if (current > prevCount()) {
101
+ setPulsing(true);
102
+ setTimeout(() => setPulsing(false), 600);
103
+ }
104
+ setPrevCount(current);
105
+ }));
106
+ return (() => {
107
+ var _el$1 = _tmpl$5(), _el$10 = _el$1.firstChild, _el$13 = _el$10.nextSibling, _el$14 = _el$13.firstChild, _el$15 = _el$14.firstChild, _el$16 = _el$14.nextSibling, _el$17 = _el$16.firstChild, _el$20 = _el$17.firstChild.nextSibling;
108
+ _el$20.nextSibling;
109
+ var _el$21 = _el$16.nextSibling, _el$22 = _el$21.firstChild;
110
+ _el$1.$$click = () => props.setSelectedId(reg.id);
111
+ insert(_el$10, () => formatForDisplay(reg.hotkey));
112
+ insert(_el$1, createComponent(Show, {
113
+ get when() {
114
+ return triggerCount() > 0;
115
+ },
116
+ get children() {
117
+ var _el$11 = _tmpl$4();
118
+ _el$11.firstChild;
119
+ insert(_el$11, triggerCount, null);
120
+ effect(() => className(_el$11, styles().triggerCount));
121
+ return _el$11;
122
+ }
123
+ }), _el$13);
124
+ insert(_el$13, (() => {
125
+ var _c$ = memo(() => !!hasTargetConflict());
126
+ return () => _c$() && (() => {
127
+ var _el$23 = _tmpl$6(), _el$24 = _el$23.firstChild;
128
+ insert(_el$23, () => targetConflictBadge().label, _el$24);
129
+ insert(_el$24, () => targetConflictBadge().tooltip);
130
+ effect((_p$) => {
131
+ var _v$0 = clsx(styles().badge, styles()[targetConflictBadge().style], styles().tooltip), _v$1 = styles().tooltipText;
132
+ _v$0 !== _p$.e && className(_el$23, _p$.e = _v$0);
133
+ _v$1 !== _p$.t && className(_el$24, _p$.t = _v$1);
134
+ return _p$;
135
+ }, {
136
+ e: void 0,
137
+ t: void 0
138
+ });
139
+ return _el$23;
140
+ })();
141
+ })(), _el$14);
142
+ insert(_el$13, (() => {
143
+ var _c$2 = memo(() => !!hasScopeConflict());
144
+ return () => _c$2() && (() => {
145
+ var _el$25 = _tmpl$7(), _el$27 = _el$25.firstChild.nextSibling;
146
+ insert(_el$27, scopeConflictTooltip);
147
+ effect((_p$) => {
148
+ var _v$10 = clsx(styles().badge, styles().badgeInfo, styles().tooltip), _v$11 = styles().tooltipText;
149
+ _v$10 !== _p$.e && className(_el$25, _p$.e = _v$10);
150
+ _v$11 !== _p$.t && className(_el$27, _p$.t = _v$11);
151
+ return _p$;
152
+ }, {
153
+ e: void 0,
154
+ t: void 0
155
+ });
156
+ return _el$25;
157
+ })();
158
+ })(), _el$14);
159
+ insert(_el$14, () => enabled() ? "on" : "off", _el$15);
160
+ insert(_el$15, () => enabled() ? "Hotkey is enabled" : "Hotkey is disabled");
161
+ insert(_el$16, () => reg.options.eventType ?? "keydown", _el$17);
162
+ insert(_el$17, () => reg.options.eventType ?? "keydown", _el$20);
163
+ insert(_el$21, () => getTargetLabel(reg.target), _el$22);
164
+ insert(_el$22, () => getTargetTooltip(reg.target));
165
+ effect((_p$) => {
166
+ var _v$ = clsx(styles().hotkeyRow, props.selectedId() === reg.id && styles().hotkeyRowSelected, pulsing() && styles().hotkeyRowTriggered), _v$2 = styles().hotkeyLabel, _v$3 = styles().hotkeyBadges, _v$4 = clsx(styles().badge, enabled() ? styles().badgeEnabled : styles().badgeDisabled, styles().tooltip), _v$5 = styles().tooltipText, _v$6 = clsx(styles().badge, (reg.options.eventType ?? "keydown") === "keydown" ? styles().badgeKeydown : styles().badgeKeyup, styles().tooltip), _v$7 = styles().tooltipText, _v$8 = clsx(styles().badge, styles().badgeTarget, styles().tooltip), _v$9 = styles().tooltipText;
167
+ _v$ !== _p$.e && className(_el$1, _p$.e = _v$);
168
+ _v$2 !== _p$.t && className(_el$10, _p$.t = _v$2);
169
+ _v$3 !== _p$.a && className(_el$13, _p$.a = _v$3);
170
+ _v$4 !== _p$.o && className(_el$14, _p$.o = _v$4);
171
+ _v$5 !== _p$.i && className(_el$15, _p$.i = _v$5);
172
+ _v$6 !== _p$.n && className(_el$16, _p$.n = _v$6);
173
+ _v$7 !== _p$.s && className(_el$17, _p$.s = _v$7);
174
+ _v$8 !== _p$.h && className(_el$21, _p$.h = _v$8);
175
+ _v$9 !== _p$.r && className(_el$22, _p$.r = _v$9);
176
+ return _p$;
177
+ }, {
178
+ e: void 0,
179
+ t: void 0,
180
+ a: void 0,
181
+ o: void 0,
182
+ i: void 0,
183
+ n: void 0,
184
+ s: void 0,
185
+ h: void 0,
186
+ r: void 0
187
+ });
188
+ return _el$1;
189
+ })();
190
+ }
191
+ }));
192
+ effect(() => className(_el$5, styles().hotkeyList));
193
+ return _el$5;
194
+ })(),
195
+ (() => {
196
+ var _el$6 = _tmpl$3(), _el$9 = _el$6.firstChild.nextSibling;
197
+ _el$9.nextSibling;
198
+ insert(_el$6, () => sequenceRegistrations().length, _el$9);
199
+ effect(() => className(_el$6, styles().panelHeader));
200
+ return _el$6;
201
+ })(),
202
+ (() => {
203
+ var _el$0 = _tmpl$2();
204
+ insert(_el$0, createComponent(For, {
205
+ get each() {
206
+ return sequenceRegistrations();
207
+ },
208
+ children: (reg) => {
209
+ const targetConflicts = () => findSequenceTargetConflicts(reg, sequenceRegistrations());
210
+ const scopeConflicts = () => findSequenceScopeConflicts(reg, sequenceRegistrations());
211
+ const hasTargetConflict = () => targetConflicts().length > 0;
212
+ const hasScopeConflict = () => scopeConflicts().length > 0;
213
+ const conflictBehavior = () => reg.options.conflictBehavior ?? "warn";
214
+ const targetConflictBadge = () => {
215
+ const behavior = conflictBehavior();
216
+ const c = targetConflicts();
217
+ if (behavior === "allow") return {
218
+ style: "badgeAllow",
219
+ label: "~",
220
+ tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? "s" : ""} on same sequence and target (conflictBehavior: allow)`
221
+ };
222
+ if (behavior === "error") return {
223
+ style: "badgeError",
224
+ label: "!",
225
+ tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? "s" : ""} on same sequence and target (conflictBehavior: error)`
226
+ };
227
+ return {
228
+ style: "badgeConflict",
229
+ label: "!",
230
+ tooltip: `Warning: ${c.length} other binding${c.length > 1 ? "s" : ""} on same sequence and target`
231
+ };
72
232
  };
73
- return {
74
- style: "badgeConflict",
75
- label: "!",
76
- tooltip: `Warning: ${c.length} other binding${c.length > 1 ? "s" : ""} on same key and target`
233
+ const scopeConflictTooltip = () => {
234
+ const c = scopeConflicts();
235
+ return `Info: ${c.length} binding${c.length > 1 ? "s" : ""} with same sequence on different target${c.length > 1 ? "s" : ""}`;
77
236
  };
78
- };
79
- const scopeConflictTooltip = () => {
80
- const c = scopeConflicts();
81
- return `Info: ${c.length} binding${c.length > 1 ? "s" : ""} with same key on different target${c.length > 1 ? "s" : ""}`;
82
- };
83
- const enabled = () => reg.options.enabled !== false;
84
- const triggerCount = () => registrations().find((r) => r.id === reg.id)?.triggerCount ?? reg.triggerCount;
85
- const [prevCount, setPrevCount] = createSignal(reg.triggerCount);
86
- const [pulsing, setPulsing] = createSignal(false);
87
- createEffect(on(triggerCount, (current) => {
88
- if (current > prevCount()) {
89
- setPulsing(true);
90
- setTimeout(() => setPulsing(false), 600);
91
- }
92
- setPrevCount(current);
93
- }));
94
- return (() => {
95
- var _el$6 = _tmpl$4(), _el$7 = _el$6.firstChild, _el$0 = _el$7.nextSibling, _el$1 = _el$0.firstChild, _el$10 = _el$1.firstChild, _el$11 = _el$1.nextSibling, _el$12 = _el$11.firstChild, _el$15 = _el$12.firstChild.nextSibling;
96
- _el$15.nextSibling;
97
- var _el$16 = _el$11.nextSibling, _el$17 = _el$16.firstChild;
98
- _el$6.$$click = () => props.setSelectedId(reg.id);
99
- insert(_el$7, () => formatForDisplay(reg.hotkey));
100
- insert(_el$6, createComponent(Show, {
101
- get when() {
102
- return triggerCount() > 0;
103
- },
104
- get children() {
105
- var _el$8 = _tmpl$3();
106
- _el$8.firstChild;
107
- insert(_el$8, triggerCount, null);
108
- effect(() => className(_el$8, styles().triggerCount));
109
- return _el$8;
237
+ const enabled = () => reg.options.enabled !== false;
238
+ const triggerCount = () => sequenceRegistrations().find((r) => r.id === reg.id)?.triggerCount ?? reg.triggerCount;
239
+ const [prevCount, setPrevCount] = createSignal(reg.triggerCount);
240
+ const [pulsing, setPulsing] = createSignal(false);
241
+ createEffect(on(triggerCount, (current) => {
242
+ if (current > prevCount()) {
243
+ setPulsing(true);
244
+ setTimeout(() => setPulsing(false), 600);
110
245
  }
111
- }), _el$0);
112
- insert(_el$0, (() => {
113
- var _c$ = memo(() => !!hasTargetConflict());
114
- return () => _c$() && (() => {
115
- var _el$18 = _tmpl$5(), _el$19 = _el$18.firstChild;
116
- insert(_el$18, () => targetConflictBadge().label, _el$19);
117
- insert(_el$19, () => targetConflictBadge().tooltip);
118
- effect((_p$) => {
119
- var _v$0 = clsx(styles().badge, styles()[targetConflictBadge().style], styles().tooltip), _v$1 = styles().tooltipText;
120
- _v$0 !== _p$.e && className(_el$18, _p$.e = _v$0);
121
- _v$1 !== _p$.t && className(_el$19, _p$.t = _v$1);
122
- return _p$;
123
- }, {
124
- e: void 0,
125
- t: void 0
126
- });
127
- return _el$18;
128
- })();
129
- })(), _el$1);
130
- insert(_el$0, (() => {
131
- var _c$2 = memo(() => !!hasScopeConflict());
132
- return () => _c$2() && (() => {
133
- var _el$20 = _tmpl$6(), _el$22 = _el$20.firstChild.nextSibling;
134
- insert(_el$22, scopeConflictTooltip);
135
- effect((_p$) => {
136
- var _v$10 = clsx(styles().badge, styles().badgeInfo, styles().tooltip), _v$11 = styles().tooltipText;
137
- _v$10 !== _p$.e && className(_el$20, _p$.e = _v$10);
138
- _v$11 !== _p$.t && className(_el$22, _p$.t = _v$11);
139
- return _p$;
140
- }, {
141
- e: void 0,
142
- t: void 0
143
- });
144
- return _el$20;
145
- })();
146
- })(), _el$1);
147
- insert(_el$1, () => enabled() ? "on" : "off", _el$10);
148
- insert(_el$10, () => enabled() ? "Hotkey is enabled" : "Hotkey is disabled");
149
- insert(_el$11, () => reg.options.eventType ?? "keydown", _el$12);
150
- insert(_el$12, () => reg.options.eventType ?? "keydown", _el$15);
151
- insert(_el$16, () => getTargetLabel(reg.target), _el$17);
152
- insert(_el$17, () => getTargetTooltip(reg.target));
153
- effect((_p$) => {
154
- var _v$ = clsx(styles().hotkeyRow, props.selectedId() === reg.id && styles().hotkeyRowSelected, pulsing() && styles().hotkeyRowTriggered), _v$2 = styles().hotkeyLabel, _v$3 = styles().hotkeyBadges, _v$4 = clsx(styles().badge, enabled() ? styles().badgeEnabled : styles().badgeDisabled, styles().tooltip), _v$5 = styles().tooltipText, _v$6 = clsx(styles().badge, (reg.options.eventType ?? "keydown") === "keydown" ? styles().badgeKeydown : styles().badgeKeyup, styles().tooltip), _v$7 = styles().tooltipText, _v$8 = clsx(styles().badge, styles().badgeTarget, styles().tooltip), _v$9 = styles().tooltipText;
155
- _v$ !== _p$.e && className(_el$6, _p$.e = _v$);
156
- _v$2 !== _p$.t && className(_el$7, _p$.t = _v$2);
157
- _v$3 !== _p$.a && className(_el$0, _p$.a = _v$3);
158
- _v$4 !== _p$.o && className(_el$1, _p$.o = _v$4);
159
- _v$5 !== _p$.i && className(_el$10, _p$.i = _v$5);
160
- _v$6 !== _p$.n && className(_el$11, _p$.n = _v$6);
161
- _v$7 !== _p$.s && className(_el$12, _p$.s = _v$7);
162
- _v$8 !== _p$.h && className(_el$16, _p$.h = _v$8);
163
- _v$9 !== _p$.r && className(_el$17, _p$.r = _v$9);
164
- return _p$;
165
- }, {
166
- e: void 0,
167
- t: void 0,
168
- a: void 0,
169
- o: void 0,
170
- i: void 0,
171
- n: void 0,
172
- s: void 0,
173
- h: void 0,
174
- r: void 0
175
- });
176
- return _el$6;
177
- })();
178
- }
179
- }));
180
- effect(() => className(_el$5, styles().hotkeyList));
181
- return _el$5;
182
- })()];
246
+ setPrevCount(current);
247
+ }));
248
+ return (() => {
249
+ var _el$28 = _tmpl$5(), _el$29 = _el$28.firstChild, _el$32 = _el$29.nextSibling, _el$33 = _el$32.firstChild, _el$34 = _el$33.firstChild, _el$35 = _el$33.nextSibling, _el$36 = _el$35.firstChild, _el$39 = _el$36.firstChild.nextSibling;
250
+ _el$39.nextSibling;
251
+ var _el$40 = _el$35.nextSibling, _el$41 = _el$40.firstChild;
252
+ _el$28.$$click = () => props.setSelectedId(reg.id);
253
+ insert(_el$29, () => formatHotkeySequence(reg.sequence));
254
+ insert(_el$28, createComponent(Show, {
255
+ get when() {
256
+ return triggerCount() > 0;
257
+ },
258
+ get children() {
259
+ var _el$30 = _tmpl$4();
260
+ _el$30.firstChild;
261
+ insert(_el$30, triggerCount, null);
262
+ effect(() => className(_el$30, styles().triggerCount));
263
+ return _el$30;
264
+ }
265
+ }), _el$32);
266
+ insert(_el$32, (() => {
267
+ var _c$3 = memo(() => !!hasTargetConflict());
268
+ return () => _c$3() && (() => {
269
+ var _el$42 = _tmpl$6(), _el$43 = _el$42.firstChild;
270
+ insert(_el$42, () => targetConflictBadge().label, _el$43);
271
+ insert(_el$43, () => targetConflictBadge().tooltip);
272
+ effect((_p$) => {
273
+ var _v$21 = clsx(styles().badge, styles()[targetConflictBadge().style], styles().tooltip), _v$22 = styles().tooltipText;
274
+ _v$21 !== _p$.e && className(_el$42, _p$.e = _v$21);
275
+ _v$22 !== _p$.t && className(_el$43, _p$.t = _v$22);
276
+ return _p$;
277
+ }, {
278
+ e: void 0,
279
+ t: void 0
280
+ });
281
+ return _el$42;
282
+ })();
283
+ })(), _el$33);
284
+ insert(_el$32, (() => {
285
+ var _c$4 = memo(() => !!hasScopeConflict());
286
+ return () => _c$4() && (() => {
287
+ var _el$44 = _tmpl$7(), _el$46 = _el$44.firstChild.nextSibling;
288
+ insert(_el$46, scopeConflictTooltip);
289
+ effect((_p$) => {
290
+ var _v$23 = clsx(styles().badge, styles().badgeInfo, styles().tooltip), _v$24 = styles().tooltipText;
291
+ _v$23 !== _p$.e && className(_el$44, _p$.e = _v$23);
292
+ _v$24 !== _p$.t && className(_el$46, _p$.t = _v$24);
293
+ return _p$;
294
+ }, {
295
+ e: void 0,
296
+ t: void 0
297
+ });
298
+ return _el$44;
299
+ })();
300
+ })(), _el$33);
301
+ insert(_el$33, () => enabled() ? "on" : "off", _el$34);
302
+ insert(_el$34, () => enabled() ? "Sequence is enabled" : "Sequence is disabled");
303
+ insert(_el$35, () => reg.options.eventType ?? "keydown", _el$36);
304
+ insert(_el$36, () => reg.options.eventType ?? "keydown", _el$39);
305
+ insert(_el$40, () => getTargetLabel(reg.target), _el$41);
306
+ insert(_el$41, () => getTargetTooltip(reg.target));
307
+ effect((_p$) => {
308
+ var _v$12 = clsx(styles().hotkeyRow, props.selectedId() === reg.id && styles().hotkeyRowSelected, pulsing() && styles().hotkeyRowTriggered), _v$13 = styles().hotkeyLabel, _v$14 = styles().hotkeyBadges, _v$15 = clsx(styles().badge, enabled() ? styles().badgeEnabled : styles().badgeDisabled, styles().tooltip), _v$16 = styles().tooltipText, _v$17 = clsx(styles().badge, (reg.options.eventType ?? "keydown") === "keydown" ? styles().badgeKeydown : styles().badgeKeyup, styles().tooltip), _v$18 = styles().tooltipText, _v$19 = clsx(styles().badge, styles().badgeTarget, styles().tooltip), _v$20 = styles().tooltipText;
309
+ _v$12 !== _p$.e && className(_el$28, _p$.e = _v$12);
310
+ _v$13 !== _p$.t && className(_el$29, _p$.t = _v$13);
311
+ _v$14 !== _p$.a && className(_el$32, _p$.a = _v$14);
312
+ _v$15 !== _p$.o && className(_el$33, _p$.o = _v$15);
313
+ _v$16 !== _p$.i && className(_el$34, _p$.i = _v$16);
314
+ _v$17 !== _p$.n && className(_el$35, _p$.n = _v$17);
315
+ _v$18 !== _p$.s && className(_el$36, _p$.s = _v$18);
316
+ _v$19 !== _p$.h && className(_el$40, _p$.h = _v$19);
317
+ _v$20 !== _p$.r && className(_el$41, _p$.r = _v$20);
318
+ return _p$;
319
+ }, {
320
+ e: void 0,
321
+ t: void 0,
322
+ a: void 0,
323
+ o: void 0,
324
+ i: void 0,
325
+ n: void 0,
326
+ s: void 0,
327
+ h: void 0,
328
+ r: void 0
329
+ });
330
+ return _el$28;
331
+ })();
332
+ }
333
+ }));
334
+ effect(() => className(_el$0, styles().hotkeyList));
335
+ return _el$0;
336
+ })()
337
+ ];
183
338
  }
184
339
  delegateEvents(["click"]);
185
340
 
package/dist/components/HotkeyList.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"HotkeyList.js","names":["For","Show","createEffect","createMemo","createSignal","on","clsx","formatForDisplay","useStyles","useHotkeysDevtoolsState","ConflictBehavior","HotkeyRegistration","HotkeyListProps","selectedId","setSelectedId","id","getTargetLabel","target","HTMLElement","Document","Window","document","window","tagName","toLowerCase","getTargetTooltip","tag","parts","Array","push","className","classes","split","filter","Boolean","join","dataAttrs","from","attributes","attr","name","startsWith","map","value","length","findTargetConflicts","registration","all","other","hotkey","options","eventType","findScopeConflicts","HotkeyList","props","styles","state","registrations","_el$","_tmpl$","_el$2","firstChild","_el$4","nextSibling","_el$3","_$insert","_$effect","_$className","panelHeader","_el$5","_tmpl$2","_$createComponent","each","children","reg","targetConflicts","scopeConflicts","hasTargetConflict","hasScopeConflict","conflictBehavior","targetConflictBadge","behavior","c","style","const","label","tooltip","scopeConflictTooltip","enabled","triggerCount","find","r","prevCount","setPrevCount","pulsing","setPulsing","current","setTimeout","_el$6","_tmpl$4","_el$7","_el$0","_el$1","_el$10","_el$11","_el$12","_el$13","_el$15","_el$14","_el$16","_el$17","$$click","when","_el$8","_tmpl$3","_el$9","_c$","_$memo","_el$18","_tmpl$5","_el$19","_p$","_v$0","badge","_v$1","tooltipText","e","t","undefined","_c$2","_el$20","_tmpl$6","_el$21","_el$22","_v$10","badgeInfo","_v$11","_v$","hotkeyRow","hotkeyRowSelected","hotkeyRowTriggered","_v$2","hotkeyLabel","_v$3","hotkeyBadges","_v$4","badgeEnabled","badgeDisabled","_v$5","_v$6","badgeKeydown","badgeKeyup","_v$7","_v$8","badgeTarget","_v$9","a","o","i","n","s","h","hotkeyList","_$delegateEvents"],"sources":["../../src/components/HotkeyList.tsx"],"sourcesContent":["import { For, Show, createEffect, createMemo, createSignal, on } from 'solid-js'\nimport clsx from 'clsx'\nimport { formatForDisplay } from '@tanstack/hotkeys'\nimport { useStyles } from '../styles/use-styles'\nimport { useHotkeysDevtoolsState } from '../HotkeysContextProvider'\nimport type { ConflictBehavior, HotkeyRegistration } from '@tanstack/hotkeys'\n\ntype HotkeyListProps = {\n selectedId: () => string | null\n setSelectedId: (id: string | null) => void\n}\n\nfunction getTargetLabel(target: HTMLElement | Document | Window): string {\n if (typeof document !== 'undefined' && target === document) {\n return 'document'\n }\n if (typeof window !== 'undefined' && target === window) {\n return 'window'\n }\n if (target instanceof HTMLElement) {\n return target.tagName.toLowerCase()\n }\n return 'element'\n}\n\nfunction getTargetTooltip(target: HTMLElement | Document | Window): string {\n if (typeof document !== 'undefined' && target === document) {\n return 'Listening on document'\n }\n if (typeof window !== 'undefined' && target === window) {\n return 'Listening on window'\n }\n if (target instanceof HTMLElement) {\n const tag = target.tagName.toLowerCase()\n const parts: Array<string> = [tag]\n if (target.id) {\n parts.push(`id=\"${target.id}\"`)\n }\n if (target.className) {\n const classes = target.className.split(/\\s+/).filter(Boolean).join(', ')\n parts.push(`class=\"${classes}\"`)\n }\n // Collect data- attributes\n const dataAttrs = Array.from(target.attributes)\n .filter((attr) => attr.name.startsWith('data-'))\n .map((attr) => `${attr.name}=\"${attr.value}\"`)\n if (dataAttrs.length > 0) {\n parts.push(...dataAttrs)\n }\n return `Listening on ${parts.join(' ')}`\n }\n return 'Listening on element'\n}\n\nfunction findTargetConflicts(\n registration: HotkeyRegistration,\n all: Array<HotkeyRegistration>,\n): Array<HotkeyRegistration> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n other.hotkey === registration.hotkey &&\n other.options.eventType === registration.options.eventType &&\n other.target === registration.target,\n )\n}\n\nfunction findScopeConflicts(\n registration: HotkeyRegistration,\n all: Array<HotkeyRegistration>,\n): Array<HotkeyRegistration> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n other.hotkey === registration.hotkey &&\n other.options.eventType === registration.options.eventType &&\n other.target !== registration.target,\n )\n}\n\nexport function HotkeyList(props: HotkeyListProps) {\n const styles = useStyles()\n const state = useHotkeysDevtoolsState()\n\n const registrations = createMemo(() => state.registrations())\n\n return (\n <>\n <div class={styles().panelHeader}>Hotkeys ({registrations().length})</div>\n <div class={styles().hotkeyList}>\n <For each={registrations()}>\n {(reg) => {\n const targetConflicts = () =>\n findTargetConflicts(reg, registrations())\n const scopeConflicts = () =>\n findScopeConflicts(reg, registrations())\n\n const hasTargetConflict = () => targetConflicts().length > 0\n const hasScopeConflict = () => scopeConflicts().length > 0\n\n const conflictBehavior = (): ConflictBehavior =>\n reg.options.conflictBehavior ?? 'warn'\n\n const targetConflictBadge = () => {\n const behavior = conflictBehavior()\n const c = targetConflicts()\n if (behavior === 'allow') {\n return {\n style: 'badgeAllow' as const,\n label: '~',\n tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? 's' : ''} on same key and target (conflictBehavior: allow)`,\n }\n }\n if (behavior === 'error') {\n return {\n style: 'badgeError' as const,\n label: '!',\n tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? 's' : ''} on same key and target (conflictBehavior: error)`,\n }\n }\n // 'warn' (default) or 'replace' (replacement already happened, but show warn-style if somehow present)\n return {\n style: 'badgeConflict' as const,\n label: '!',\n tooltip: `Warning: ${c.length} other binding${c.length > 1 ? 's' : ''} on same key and target`,\n }\n }\n\n const scopeConflictTooltip = () => {\n const c = scopeConflicts()\n return `Info: ${c.length} binding${c.length > 1 ? 's' : ''} with same key on different target${c.length > 1 ? 's' : ''}`\n }\n\n const enabled = () => reg.options.enabled !== false\n\n // Look up trigger count reactively from the registrations list\n // (reg is a stable object ref; the list re-derives on store change)\n const triggerCount = () =>\n registrations().find((r) => r.id === reg.id)?.triggerCount ??\n reg.triggerCount\n\n // Track trigger count changes for pulse animation\n const [prevCount, setPrevCount] = createSignal(reg.triggerCount)\n const [pulsing, setPulsing] = createSignal(false)\n\n createEffect(\n on(triggerCount, (current) => {\n if (current > prevCount()) {\n setPulsing(true)\n setTimeout(() => setPulsing(false), 600)\n }\n setPrevCount(current)\n }),\n )\n\n return (\n <div\n class={clsx(\n styles().hotkeyRow,\n props.selectedId() === reg.id && styles().hotkeyRowSelected,\n pulsing() && styles().hotkeyRowTriggered,\n )}\n onClick={() => props.setSelectedId(reg.id)}\n >\n <span class={styles().hotkeyLabel}>\n {formatForDisplay(reg.hotkey)}\n </span>\n <Show when={triggerCount() > 0}>\n <span class={styles().triggerCount}>x{triggerCount()}</span>\n </Show>\n <div class={styles().hotkeyBadges}>\n {hasTargetConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles()[targetConflictBadge().style],\n styles().tooltip,\n )}\n >\n {targetConflictBadge().label}\n <span class={styles().tooltipText} data-tooltip>\n {targetConflictBadge().tooltip}\n </span>\n </span>\n )}\n {hasScopeConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles().badgeInfo,\n styles().tooltip,\n )}\n >\n i\n <span class={styles().tooltipText} data-tooltip>\n {scopeConflictTooltip()}\n </span>\n </span>\n )}\n <span\n class={clsx(\n styles().badge,\n enabled()\n ? styles().badgeEnabled\n : styles().badgeDisabled,\n styles().tooltip,\n )}\n >\n {enabled() ? 'on' : 'off'}\n <span class={styles().tooltipText} data-tooltip>\n {enabled() ? 'Hotkey is enabled' : 'Hotkey is disabled'}\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n (reg.options.eventType ?? 'keydown') === 'keydown'\n ? styles().badgeKeydown\n : styles().badgeKeyup,\n styles().tooltip,\n )}\n >\n {reg.options.eventType ?? 'keydown'}\n <span class={styles().tooltipText} data-tooltip>\n Fires on {reg.options.eventType ?? 'keydown'} event\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n styles().badgeTarget,\n styles().tooltip,\n )}\n >\n {getTargetLabel(reg.target)}\n <span class={styles().tooltipText} data-tooltip>\n {getTargetTooltip(reg.target)}\n </span>\n </span>\n </div>\n </div>\n )\n }}\n </For>\n </div>\n </>\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"HotkeyList.js","names":["For","Show","createEffect","createMemo","createSignal","on","clsx","formatForDisplay","formatHotkeySequence","useStyles","useHotkeysDevtoolsState","ConflictBehavior","HotkeyRegistration","SequenceRegistrationView","sequenceKey","sequence","Array","join","HotkeyListProps","selectedId","setSelectedId","id","getTargetLabel","target","HTMLElement","Document","Window","document","window","tagName","toLowerCase","getTargetTooltip","tag","parts","push","className","classes","split","filter","Boolean","dataAttrs","from","attributes","attr","name","startsWith","map","value","length","findTargetConflicts","registration","all","other","hotkey","options","eventType","findScopeConflicts","findSequenceTargetConflicts","findSequenceScopeConflicts","HotkeyList","props","styles","state","registrations","sequenceRegistrations","_el$","_tmpl$","_el$2","firstChild","_el$4","nextSibling","_el$3","_$insert","_$effect","_$className","panelHeader","_el$5","_tmpl$2","_$createComponent","each","children","reg","targetConflicts","scopeConflicts","hasTargetConflict","hasScopeConflict","conflictBehavior","targetConflictBadge","behavior","c","style","const","label","tooltip","scopeConflictTooltip","enabled","triggerCount","find","r","prevCount","setPrevCount","pulsing","setPulsing","current","setTimeout","_el$1","_tmpl$5","_el$10","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_el$20","_el$19","_el$21","_el$22","$$click","when","_el$11","_tmpl$4","_el$12","_c$","_$memo","_el$23","_tmpl$6","_el$24","_p$","_v$0","badge","_v$1","tooltipText","e","t","undefined","_c$2","_el$25","_tmpl$7","_el$26","_el$27","_v$10","badgeInfo","_v$11","_v$","hotkeyRow","hotkeyRowSelected","hotkeyRowTriggered","_v$2","hotkeyLabel","_v$3","hotkeyBadges","_v$4","badgeEnabled","badgeDisabled","_v$5","_v$6","badgeKeydown","badgeKeyup","_v$7","_v$8","badgeTarget","_v$9","a","o","i","n","s","h","hotkeyList","_el$6","_tmpl$3","_el$7","_el$9","_el$8","_el$0","_el$28","_el$29","_el$32","_el$33","_el$34","_el$35","_el$36","_el$37","_el$39","_el$38","_el$40","_el$41","_el$30","_el$31","_c$3","_el$42","_el$43","_v$21","_v$22","_c$4","_el$44","_el$45","_el$46","_v$23","_v$24","_v$12","_v$13","_v$14","_v$15","_v$16","_v$17","_v$18","_v$19","_v$20","_$delegateEvents"],"sources":["../../src/components/HotkeyList.tsx"],"sourcesContent":["import { For, Show, createEffect, createMemo, createSignal, on } from 'solid-js'\nimport clsx from 'clsx'\nimport { formatForDisplay, formatHotkeySequence } from '@tanstack/hotkeys'\nimport { useStyles } from '../styles/use-styles'\nimport { useHotkeysDevtoolsState } from '../HotkeysContextProvider'\nimport type {\n ConflictBehavior,\n HotkeyRegistration,\n SequenceRegistrationView,\n} from '@tanstack/hotkeys'\n\nfunction sequenceKey(sequence: Array<string>): string {\n return sequence.join('|')\n}\n\ntype HotkeyListProps = {\n selectedId: () => string | null\n setSelectedId: (id: string | null) => void\n}\n\nfunction getTargetLabel(target: HTMLElement | Document | Window): string {\n if (typeof document !== 'undefined' && target === document) {\n return 'document'\n }\n if (typeof window !== 'undefined' && target === window) {\n return 'window'\n }\n if (target instanceof HTMLElement) {\n return target.tagName.toLowerCase()\n }\n return 'element'\n}\n\nfunction getTargetTooltip(target: HTMLElement | Document | Window): string {\n if (typeof document !== 'undefined' && target === document) {\n return 'Listening on document'\n }\n if (typeof window !== 'undefined' && target === window) {\n return 'Listening on window'\n }\n if (target instanceof HTMLElement) {\n const tag = target.tagName.toLowerCase()\n const parts: Array<string> = [tag]\n if (target.id) {\n parts.push(`id=\"${target.id}\"`)\n }\n if (target.className) {\n const classes = target.className.split(/\\s+/).filter(Boolean).join(', ')\n parts.push(`class=\"${classes}\"`)\n }\n // Collect data- attributes\n const dataAttrs = Array.from(target.attributes)\n .filter((attr) => attr.name.startsWith('data-'))\n .map((attr) => `${attr.name}=\"${attr.value}\"`)\n if (dataAttrs.length > 0) {\n parts.push(...dataAttrs)\n }\n return `Listening on ${parts.join(' ')}`\n }\n return 'Listening on element'\n}\n\nfunction findTargetConflicts(\n registration: HotkeyRegistration,\n all: Array<HotkeyRegistration>,\n): Array<HotkeyRegistration> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n other.hotkey === registration.hotkey &&\n other.options.eventType === registration.options.eventType &&\n other.target === registration.target,\n )\n}\n\nfunction findScopeConflicts(\n registration: HotkeyRegistration,\n all: Array<HotkeyRegistration>,\n): Array<HotkeyRegistration> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n other.hotkey === registration.hotkey &&\n other.options.eventType === registration.options.eventType &&\n other.target !== registration.target,\n )\n}\n\nfunction findSequenceTargetConflicts(\n registration: SequenceRegistrationView,\n all: Array<SequenceRegistrationView>,\n): Array<SequenceRegistrationView> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n sequenceKey(other.sequence) === sequenceKey(registration.sequence) &&\n other.options.eventType === registration.options.eventType &&\n other.target === registration.target,\n )\n}\n\nfunction findSequenceScopeConflicts(\n registration: SequenceRegistrationView,\n all: Array<SequenceRegistrationView>,\n): Array<SequenceRegistrationView> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n sequenceKey(other.sequence) === sequenceKey(registration.sequence) &&\n other.options.eventType === registration.options.eventType &&\n other.target !== registration.target,\n )\n}\n\nexport function HotkeyList(props: HotkeyListProps) {\n const styles = useStyles()\n const state = useHotkeysDevtoolsState()\n\n const registrations = createMemo(() => state.registrations())\n const sequenceRegistrations = createMemo(() => state.sequenceRegistrations())\n\n return (\n <>\n <div class={styles().panelHeader}>Hotkeys ({registrations().length})</div>\n <div class={styles().hotkeyList}>\n <For each={registrations()}>\n {(reg) => {\n const targetConflicts = () =>\n findTargetConflicts(reg, registrations())\n const scopeConflicts = () =>\n findScopeConflicts(reg, registrations())\n\n const hasTargetConflict = () => targetConflicts().length > 0\n const hasScopeConflict = () => scopeConflicts().length > 0\n\n const conflictBehavior = (): ConflictBehavior =>\n reg.options.conflictBehavior ?? 'warn'\n\n const targetConflictBadge = () => {\n const behavior = conflictBehavior()\n const c = targetConflicts()\n if (behavior === 'allow') {\n return {\n style: 'badgeAllow' as const,\n label: '~',\n tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? 's' : ''} on same key and target (conflictBehavior: allow)`,\n }\n }\n if (behavior === 'error') {\n return {\n style: 'badgeError' as const,\n label: '!',\n tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? 's' : ''} on same key and target (conflictBehavior: error)`,\n }\n }\n // 'warn' (default) or 'replace' (replacement already happened, but show warn-style if somehow present)\n return {\n style: 'badgeConflict' as const,\n label: '!',\n tooltip: `Warning: ${c.length} other binding${c.length > 1 ? 's' : ''} on same key and target`,\n }\n }\n\n const scopeConflictTooltip = () => {\n const c = scopeConflicts()\n return `Info: ${c.length} binding${c.length > 1 ? 's' : ''} with same key on different target${c.length > 1 ? 's' : ''}`\n }\n\n const enabled = () => reg.options.enabled !== false\n\n // Look up trigger count reactively from the registrations list\n // (reg is a stable object ref; the list re-derives on store change)\n const triggerCount = () =>\n registrations().find((r) => r.id === reg.id)?.triggerCount ??\n reg.triggerCount\n\n // Track trigger count changes for pulse animation\n const [prevCount, setPrevCount] = createSignal(reg.triggerCount)\n const [pulsing, setPulsing] = createSignal(false)\n\n createEffect(\n on(triggerCount, (current) => {\n if (current > prevCount()) {\n setPulsing(true)\n setTimeout(() => setPulsing(false), 600)\n }\n setPrevCount(current)\n }),\n )\n\n return (\n <div\n class={clsx(\n styles().hotkeyRow,\n props.selectedId() === reg.id && styles().hotkeyRowSelected,\n pulsing() && styles().hotkeyRowTriggered,\n )}\n onClick={() => props.setSelectedId(reg.id)}\n >\n <span class={styles().hotkeyLabel}>\n {formatForDisplay(reg.hotkey)}\n </span>\n <Show when={triggerCount() > 0}>\n <span class={styles().triggerCount}>x{triggerCount()}</span>\n </Show>\n <div class={styles().hotkeyBadges}>\n {hasTargetConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles()[targetConflictBadge().style],\n styles().tooltip,\n )}\n >\n {targetConflictBadge().label}\n <span class={styles().tooltipText} data-tooltip>\n {targetConflictBadge().tooltip}\n </span>\n </span>\n )}\n {hasScopeConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles().badgeInfo,\n styles().tooltip,\n )}\n >\n i\n <span class={styles().tooltipText} data-tooltip>\n {scopeConflictTooltip()}\n </span>\n </span>\n )}\n <span\n class={clsx(\n styles().badge,\n enabled()\n ? styles().badgeEnabled\n : styles().badgeDisabled,\n styles().tooltip,\n )}\n >\n {enabled() ? 'on' : 'off'}\n <span class={styles().tooltipText} data-tooltip>\n {enabled() ? 'Hotkey is enabled' : 'Hotkey is disabled'}\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n (reg.options.eventType ?? 'keydown') === 'keydown'\n ? styles().badgeKeydown\n : styles().badgeKeyup,\n styles().tooltip,\n )}\n >\n {reg.options.eventType ?? 'keydown'}\n <span class={styles().tooltipText} data-tooltip>\n Fires on {reg.options.eventType ?? 'keydown'} event\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n styles().badgeTarget,\n styles().tooltip,\n )}\n >\n {getTargetLabel(reg.target)}\n <span class={styles().tooltipText} data-tooltip>\n {getTargetTooltip(reg.target)}\n </span>\n </span>\n </div>\n </div>\n )\n }}\n </For>\n </div>\n\n <div class={styles().panelHeader}>\n Sequences ({sequenceRegistrations().length})\n </div>\n <div class={styles().hotkeyList}>\n <For each={sequenceRegistrations()}>\n {(reg) => {\n const targetConflicts = () =>\n findSequenceTargetConflicts(reg, sequenceRegistrations())\n const scopeConflicts = () =>\n findSequenceScopeConflicts(reg, sequenceRegistrations())\n\n const hasTargetConflict = () => targetConflicts().length > 0\n const hasScopeConflict = () => scopeConflicts().length > 0\n\n const conflictBehavior = (): ConflictBehavior =>\n reg.options.conflictBehavior ?? 'warn'\n\n const targetConflictBadge = () => {\n const behavior = conflictBehavior()\n const c = targetConflicts()\n if (behavior === 'allow') {\n return {\n style: 'badgeAllow' as const,\n label: '~',\n tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? 's' : ''} on same sequence and target (conflictBehavior: allow)`,\n }\n }\n if (behavior === 'error') {\n return {\n style: 'badgeError' as const,\n label: '!',\n tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? 's' : ''} on same sequence and target (conflictBehavior: error)`,\n }\n }\n return {\n style: 'badgeConflict' as const,\n label: '!',\n tooltip: `Warning: ${c.length} other binding${c.length > 1 ? 's' : ''} on same sequence and target`,\n }\n }\n\n const scopeConflictTooltip = () => {\n const c = scopeConflicts()\n return `Info: ${c.length} binding${c.length > 1 ? 's' : ''} with same sequence on different target${c.length > 1 ? 's' : ''}`\n }\n\n const enabled = () => reg.options.enabled !== false\n\n const triggerCount = () =>\n sequenceRegistrations().find((r) => r.id === reg.id)\n ?.triggerCount ?? reg.triggerCount\n\n const [prevCount, setPrevCount] = createSignal(reg.triggerCount)\n const [pulsing, setPulsing] = createSignal(false)\n\n createEffect(\n on(triggerCount, (current) => {\n if (current > prevCount()) {\n setPulsing(true)\n setTimeout(() => setPulsing(false), 600)\n }\n setPrevCount(current)\n }),\n )\n\n return (\n <div\n class={clsx(\n styles().hotkeyRow,\n props.selectedId() === reg.id && styles().hotkeyRowSelected,\n pulsing() && styles().hotkeyRowTriggered,\n )}\n onClick={() => props.setSelectedId(reg.id)}\n >\n <span class={styles().hotkeyLabel}>\n {formatHotkeySequence(reg.sequence)}\n </span>\n <Show when={triggerCount() > 0}>\n <span class={styles().triggerCount}>x{triggerCount()}</span>\n </Show>\n <div class={styles().hotkeyBadges}>\n {hasTargetConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles()[targetConflictBadge().style],\n styles().tooltip,\n )}\n >\n {targetConflictBadge().label}\n <span class={styles().tooltipText} data-tooltip>\n {targetConflictBadge().tooltip}\n </span>\n </span>\n )}\n {hasScopeConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles().badgeInfo,\n styles().tooltip,\n )}\n >\n i\n <span class={styles().tooltipText} data-tooltip>\n {scopeConflictTooltip()}\n </span>\n </span>\n )}\n <span\n class={clsx(\n styles().badge,\n enabled()\n ? styles().badgeEnabled\n : styles().badgeDisabled,\n styles().tooltip,\n )}\n >\n {enabled() ? 'on' : 'off'}\n <span class={styles().tooltipText} data-tooltip>\n {enabled()\n ? 'Sequence is enabled'\n : 'Sequence is disabled'}\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n (reg.options.eventType ?? 'keydown') === 'keydown'\n ? styles().badgeKeydown\n : styles().badgeKeyup,\n styles().tooltip,\n )}\n >\n {reg.options.eventType ?? 'keydown'}\n <span class={styles().tooltipText} data-tooltip>\n Fires on {reg.options.eventType ?? 'keydown'} event\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n styles().badgeTarget,\n styles().tooltip,\n )}\n >\n {getTargetLabel(reg.target)}\n <span class={styles().tooltipText} data-tooltip>\n {getTargetTooltip(reg.target)}\n </span>\n </span>\n </div>\n </div>\n )\n }}\n </For>\n </div>\n </>\n )\n}\n"],"mappings":"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"}
package/dist/components/Shell.js CHANGED
@@ -18,7 +18,9 @@ function Shell() {
18
18
  const selectedRegistration = createMemo(() => {
19
19
  const id = selectedId();
20
20
  if (!id) return null;
21
- return state.registrations().find((r) => r.id === id) ?? null;
21
+ const hotkey = state.registrations().find((r) => r.id === id);
22
+ if (hotkey) return hotkey;
23
+ return state.sequenceRegistrations().find((r) => r.id === id) ?? null;
22
24
  });
23
25
  let dragStartX = 0;
24
26
  let dragStartWidth = 0;