@tanstack/hotkeys-devtools 1.3.5 → 1.4.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 +1 -1
- package/dist/HotkeysContextProvider.js +14 -0
- package/dist/_registrations.js +3 -2
- package/dist/_scopes.js +41 -0
- package/dist/components/DetailsPanel.js +333 -298
- package/dist/components/HotkeyList.js +97 -49
- package/dist/components/Shell.js +1 -1
- package/dist/styles/use-styles.js +53 -3
- package/package.json +2 -2
|
@@ -2,10 +2,11 @@ import { effectiveSequenceMatchedSteps } from "../sequence-progress.js";
|
|
|
2
2
|
import { useHotkeysDevtoolsState } from "../HotkeysContextProvider.js";
|
|
3
3
|
import { useStyles } from "../styles/use-styles.js";
|
|
4
4
|
import { formatRegistration, getBindingKind, useRegistrationConflicts } from "../_registrations.js";
|
|
5
|
+
import { getScopeStatus } from "../_scopes.js";
|
|
5
6
|
import { ActionButtons } from "./ActionButtons.js";
|
|
6
7
|
import { className, createComponent, effect, insert, memo, template } from "solid-js/web";
|
|
7
8
|
import { For, Show, createMemo } from "solid-js";
|
|
8
|
-
import { detectPlatform, formatForDisplay,
|
|
9
|
+
import { detectPlatform, formatForDisplay, normalizeHotkey, parseHotkey } from "@tanstack/hotkeys";
|
|
9
10
|
import clsx from "clsx";
|
|
10
11
|
|
|
11
12
|
//#region src/components/DetailsPanel.tsx
|
|
@@ -13,17 +14,17 @@ var _tmpl$ = /*#__PURE__*/ template(`<div>`);
|
|
|
13
14
|
var _tmpl$2 = /*#__PURE__*/ template(`<div><span></span><span>`);
|
|
14
15
|
var _tmpl$3 = /*#__PURE__*/ template(`<div><div></div><div><div>ID</div><div></div><div>Matches</div><div></div><div>Raw</div><div></div><div>Target</div><div>`);
|
|
15
16
|
var _tmpl$4 = /*#__PURE__*/ template(`<div><div>Conflicts (<!>)</div><div>`);
|
|
16
|
-
var _tmpl$5 = /*#__PURE__*/ template(`<div><div><div>Key Breakdown</div><div><div><div></div></div><span aria-hidden=true>-></span><div></div></div></div><div><div>Actions</div></div><div><div>Meta</div><div><div><span>name</span><span></span></div><div><span>description</span><span></span></div></div></div><div><div>Options</div><div><div><span>enabled</span><span></span></div><div><span>eventType</span><span></span></div><div><span>preventDefault</span><span></span></div><div><span>stopPropagation</span><span></span></div><div><span>ignoreInputs</span><span></span></div><div><span>requireReset</span><span></span></div><div><span>conflictBehavior</span><span></span></div><div><span>hasFired</span><span>`);
|
|
17
|
+
var _tmpl$5 = /*#__PURE__*/ template(`<div><div><div>Key Breakdown</div><div><div><div></div></div><span aria-hidden=true>-></span><div></div></div></div><div><div>Actions</div></div><div><div>Meta</div><div><div><span>name</span><span></span></div><div><span>description</span><span></span></div></div></div><div><div>Options</div><div><div><span>enabled</span><span></span></div><div><span>scope</span><span> (<!>)</span></div><div><span>eventType</span><span></span></div><div><span>preventDefault</span><span></span></div><div><span>stopPropagation</span><span></span></div><div><span>ignoreInputs</span><span></span></div><div><span>requireReset</span><span></span></div><div><span>conflictBehavior</span><span></span></div><div><span>hasFired</span><span>`);
|
|
17
18
|
var _tmpl$6 = /*#__PURE__*/ template(`<span>+`);
|
|
18
19
|
var _tmpl$7 = /*#__PURE__*/ template(`<span>`);
|
|
19
20
|
var _tmpl$8 = /*#__PURE__*/ template(`<div><span>overlap</span> <!>: <!> (<!>) on `);
|
|
20
21
|
var _tmpl$9 = /*#__PURE__*/ template(`<div><span>scope</span> <!>: <!> (<!>) on `);
|
|
21
22
|
var _tmpl$0 = /*#__PURE__*/ template(`<div><div></div><div><div>ID</div><div></div><div>Matches</div><div></div><div>Raw</div><div></div><div>Sequence</div><div></div><div>Target</div><div>`);
|
|
22
|
-
var _tmpl$1 = /*#__PURE__*/ template(`<div><div><div>Key Breakdown</div><div></div><div>Each chord</div></div><div><div>Actions</div></div><div><div>Meta</div><div><div><span>name</span><span></span></div><div><span>description</span><span></span></div></div></div><div><div>Options</div><div><div><span>enabled</span><span></span></div><div><span>eventType</span><span></span></div><div><span>timeout</span><span>ms</span></div><div><span>preventDefault</span><span></span></div><div><span>stopPropagation</span><span></span></div><div><span>ignoreInputs</span><span></span></div><div><span>conflictBehavior</span><span>`);
|
|
23
|
+
var _tmpl$1 = /*#__PURE__*/ template(`<div><div><div>Key Breakdown</div><div></div><div>Each chord</div></div><div><div>Actions</div></div><div><div>Meta</div><div><div><span>name</span><span></span></div><div><span>description</span><span></span></div></div></div><div><div>Options</div><div><div><span>enabled</span><span></span></div><div><span>scope</span><span> (<!>)</span></div><div><span>eventType</span><span></span></div><div><span>timeout</span><span>ms</span></div><div><span>preventDefault</span><span></span></div><div><span>stopPropagation</span><span></span></div><div><span>ignoreInputs</span><span></span></div><div><span>conflictBehavior</span><span>`);
|
|
23
24
|
var _tmpl$10 = /*#__PURE__*/ template(`<span><span>`);
|
|
24
25
|
var _tmpl$11 = /*#__PURE__*/ template(`<span>→`);
|
|
25
26
|
var _tmpl$12 = /*#__PURE__*/ template(`<div><div>Step <!> — </div><div><div><div></div></div><span aria-hidden=true>-></span><div>`);
|
|
26
|
-
var _tmpl$13 = /*#__PURE__*/ template(`<div><div></div><div><div>App hotkey</div><div></div><div>Status</div><div></div><div>Default</div><div></div><div>
|
|
27
|
+
var _tmpl$13 = /*#__PURE__*/ template(`<div><div></div><div><div>App hotkey</div><div></div><div>Status</div><div></div><div>Default</div><div></div><div>Scope</div><div>`);
|
|
27
28
|
var _tmpl$14 = /*#__PURE__*/ template(`<div><div><div>Meta</div><div></div></div><div><div>Declared options</div><div>`);
|
|
28
29
|
var _tmpl$15 = /*#__PURE__*/ template(`<div>Select a hotkey from the list to view its details`);
|
|
29
30
|
const PLATFORM_ROWS = [
|
|
@@ -49,7 +50,7 @@ function KeyBreakdownPlatformTable(props) {
|
|
|
49
50
|
children: (row) => (() => {
|
|
50
51
|
var _el$2 = _tmpl$2(), _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
|
|
51
52
|
insert(_el$3, () => row.label);
|
|
52
|
-
insert(_el$4, () => formatForDisplay(
|
|
53
|
+
insert(_el$4, () => formatForDisplay(normalizeHotkey(props.getParsed(), props.getCanonicalPlatform()), { platform: row.id }));
|
|
53
54
|
effect((_p$) => {
|
|
54
55
|
var _v$ = st().platformBreakdownRow, _v$2 = st().platformBreakdownLabel, _v$3 = st().platformBreakdownPretty;
|
|
55
56
|
_v$ !== _p$.e && className(_el$2, _p$.e = _v$);
|
|
@@ -75,8 +76,9 @@ function getTargetDescription(target) {
|
|
|
75
76
|
return "element";
|
|
76
77
|
}
|
|
77
78
|
function HotkeyDetails(props) {
|
|
79
|
+
const state = useHotkeysDevtoolsState();
|
|
78
80
|
const reg = () => props.registration;
|
|
79
|
-
const parsed = () => reg().
|
|
81
|
+
const parsed = () => reg().parsedChord;
|
|
80
82
|
const conflicts = useRegistrationConflicts(reg);
|
|
81
83
|
const targetConflicts = () => conflicts().overlapping;
|
|
82
84
|
const scopeConflicts = () => conflicts().separate;
|
|
@@ -124,7 +126,9 @@ function HotkeyDetails(props) {
|
|
|
124
126
|
});
|
|
125
127
|
return _el$5;
|
|
126
128
|
})(), (() => {
|
|
127
|
-
var _el$14 = _tmpl$5(), _el$15 = _el$14.firstChild, _el$16 = _el$15.firstChild, _el$17 = _el$16.nextSibling, _el$18 = _el$17.firstChild, _el$19 = _el$18.firstChild, _el$20 = _el$18.nextSibling, _el$21 = _el$20.nextSibling, _el$22 = _el$15.nextSibling, _el$23 = _el$22.firstChild, _el$24 = _el$22.nextSibling, _el$25 = _el$24.firstChild, _el$26 = _el$25.nextSibling, _el$27 = _el$26.firstChild, _el$28 = _el$27.firstChild, _el$29 = _el$28.nextSibling, _el$30 = _el$27.nextSibling, _el$31 = _el$30.firstChild, _el$32 = _el$31.nextSibling, _el$33 = _el$24.nextSibling, _el$34 = _el$33.firstChild, _el$36 = _el$34.nextSibling.firstChild, _el$37 = _el$36.firstChild, _el$38 = _el$37.nextSibling, _el$39 = _el$36.nextSibling, _el$40 = _el$39.firstChild, _el$41 = _el$40.nextSibling, _el$42 = _el$
|
|
129
|
+
var _el$14 = _tmpl$5(), _el$15 = _el$14.firstChild, _el$16 = _el$15.firstChild, _el$17 = _el$16.nextSibling, _el$18 = _el$17.firstChild, _el$19 = _el$18.firstChild, _el$20 = _el$18.nextSibling, _el$21 = _el$20.nextSibling, _el$22 = _el$15.nextSibling, _el$23 = _el$22.firstChild, _el$24 = _el$22.nextSibling, _el$25 = _el$24.firstChild, _el$26 = _el$25.nextSibling, _el$27 = _el$26.firstChild, _el$28 = _el$27.firstChild, _el$29 = _el$28.nextSibling, _el$30 = _el$27.nextSibling, _el$31 = _el$30.firstChild, _el$32 = _el$31.nextSibling, _el$33 = _el$24.nextSibling, _el$34 = _el$33.firstChild, _el$36 = _el$34.nextSibling.firstChild, _el$37 = _el$36.firstChild, _el$38 = _el$37.nextSibling, _el$39 = _el$36.nextSibling, _el$40 = _el$39.firstChild, _el$41 = _el$40.nextSibling, _el$42 = _el$41.firstChild, _el$44 = _el$42.nextSibling;
|
|
130
|
+
_el$44.nextSibling;
|
|
131
|
+
var _el$45 = _el$39.nextSibling, _el$46 = _el$45.firstChild, _el$47 = _el$46.nextSibling, _el$48 = _el$45.nextSibling, _el$49 = _el$48.firstChild, _el$50 = _el$49.nextSibling, _el$51 = _el$48.nextSibling, _el$52 = _el$51.firstChild, _el$53 = _el$52.nextSibling, _el$54 = _el$51.nextSibling, _el$55 = _el$54.firstChild, _el$56 = _el$55.nextSibling, _el$57 = _el$54.nextSibling, _el$58 = _el$57.firstChild, _el$59 = _el$58.nextSibling, _el$60 = _el$57.nextSibling, _el$61 = _el$60.firstChild, _el$62 = _el$61.nextSibling, _el$63 = _el$60.nextSibling, _el$64 = _el$63.firstChild, _el$65 = _el$64.nextSibling;
|
|
128
132
|
insert(_el$19, createComponent(For, {
|
|
129
133
|
get each() {
|
|
130
134
|
return keyParts();
|
|
@@ -134,15 +138,15 @@ function HotkeyDetails(props) {
|
|
|
134
138
|
return i() > 0;
|
|
135
139
|
},
|
|
136
140
|
get children() {
|
|
137
|
-
var _el$
|
|
138
|
-
effect(() => className(_el$
|
|
139
|
-
return _el$
|
|
141
|
+
var _el$72 = _tmpl$6();
|
|
142
|
+
effect(() => className(_el$72, styles().keyBreakdownPlus));
|
|
143
|
+
return _el$72;
|
|
140
144
|
}
|
|
141
145
|
}), (() => {
|
|
142
|
-
var _el$
|
|
143
|
-
insert(_el$
|
|
144
|
-
effect(() => className(_el$
|
|
145
|
-
return _el$
|
|
146
|
+
var _el$73 = _tmpl$7();
|
|
147
|
+
insert(_el$73, part);
|
|
148
|
+
effect(() => className(_el$73, styles().keyCapLarge));
|
|
149
|
+
return _el$73;
|
|
146
150
|
})()]
|
|
147
151
|
}));
|
|
148
152
|
insert(_el$21, createComponent(KeyBreakdownPlatformTable, {
|
|
@@ -167,90 +171,92 @@ function HotkeyDetails(props) {
|
|
|
167
171
|
return Object.entries(reg().options.meta ?? {}).filter(([k]) => k !== "name" && k !== "description");
|
|
168
172
|
},
|
|
169
173
|
children: ([key, value]) => (() => {
|
|
170
|
-
var _el$
|
|
171
|
-
insert(_el$
|
|
172
|
-
insert(_el$
|
|
174
|
+
var _el$74 = _tmpl$2(), _el$75 = _el$74.firstChild, _el$76 = _el$75.nextSibling;
|
|
175
|
+
insert(_el$75, key);
|
|
176
|
+
insert(_el$76, () => String(value));
|
|
173
177
|
effect((_p$) => {
|
|
174
|
-
var _v$
|
|
175
|
-
_v$
|
|
176
|
-
_v$
|
|
177
|
-
_v$
|
|
178
|
+
var _v$63 = styles().optionRow, _v$64 = styles().optionLabel, _v$65 = styles().optionValue;
|
|
179
|
+
_v$63 !== _p$.e && className(_el$74, _p$.e = _v$63);
|
|
180
|
+
_v$64 !== _p$.t && className(_el$75, _p$.t = _v$64);
|
|
181
|
+
_v$65 !== _p$.a && className(_el$76, _p$.a = _v$65);
|
|
178
182
|
return _p$;
|
|
179
183
|
}, {
|
|
180
184
|
e: void 0,
|
|
181
185
|
t: void 0,
|
|
182
186
|
a: void 0
|
|
183
187
|
});
|
|
184
|
-
return _el$
|
|
188
|
+
return _el$74;
|
|
185
189
|
})()
|
|
186
190
|
});
|
|
187
191
|
}
|
|
188
192
|
}), null);
|
|
189
193
|
insert(_el$38, () => String(reg().options.enabled !== false));
|
|
190
|
-
insert(_el$41, () => reg().options.
|
|
191
|
-
insert(_el$
|
|
192
|
-
insert(_el$47, () =>
|
|
193
|
-
insert(_el$50, () => String(reg().options.
|
|
194
|
-
insert(_el$53, () => String(!!reg().options.
|
|
195
|
-
insert(_el$56,
|
|
196
|
-
insert(_el$59, () => String(reg().
|
|
194
|
+
insert(_el$41, () => reg().options.scope ?? "global", _el$42);
|
|
195
|
+
insert(_el$41, () => getScopeStatus(reg().options.scope ?? "global", state.scopes()), _el$44);
|
|
196
|
+
insert(_el$47, () => reg().options.eventType ?? "keydown");
|
|
197
|
+
insert(_el$50, () => String(!!reg().options.preventDefault));
|
|
198
|
+
insert(_el$53, () => String(!!reg().options.stopPropagation));
|
|
199
|
+
insert(_el$56, () => String(reg().options.ignoreInputs ?? "auto"));
|
|
200
|
+
insert(_el$59, () => String(!!reg().options.requireReset));
|
|
201
|
+
insert(_el$62, conflictBehavior);
|
|
202
|
+
insert(_el$65, () => String(reg().hasFired));
|
|
197
203
|
insert(_el$14, createComponent(Show, {
|
|
198
204
|
get when() {
|
|
199
205
|
return allConflicts().length > 0;
|
|
200
206
|
},
|
|
201
207
|
get children() {
|
|
202
|
-
var _el$
|
|
203
|
-
_el$
|
|
204
|
-
var _el$
|
|
205
|
-
insert(_el$
|
|
206
|
-
insert(_el$
|
|
208
|
+
var _el$66 = _tmpl$4(), _el$67 = _el$66.firstChild, _el$70 = _el$67.firstChild.nextSibling;
|
|
209
|
+
_el$70.nextSibling;
|
|
210
|
+
var _el$71 = _el$67.nextSibling;
|
|
211
|
+
insert(_el$67, () => allConflicts().length, _el$70);
|
|
212
|
+
insert(_el$71, createComponent(For, {
|
|
207
213
|
get each() {
|
|
208
214
|
return targetConflicts();
|
|
209
215
|
},
|
|
210
216
|
children: (conflict) => {
|
|
211
217
|
return (() => {
|
|
212
|
-
var _el$
|
|
213
|
-
_el$
|
|
214
|
-
insert(_el$
|
|
215
|
-
insert(_el$
|
|
216
|
-
insert(_el$
|
|
217
|
-
insert(_el$
|
|
218
|
-
effect(() => className(_el$
|
|
219
|
-
return _el$
|
|
218
|
+
var _el$77 = _tmpl$8(), _el$85 = _el$77.firstChild.nextSibling.nextSibling, _el$86 = _el$85.nextSibling.nextSibling, _el$87 = _el$86.nextSibling.nextSibling;
|
|
219
|
+
_el$87.nextSibling;
|
|
220
|
+
insert(_el$77, () => conflict.id, _el$85);
|
|
221
|
+
insert(_el$77, () => formatRegistration(conflict), _el$86);
|
|
222
|
+
insert(_el$77, () => conflict.options.eventType ?? "keydown", _el$87);
|
|
223
|
+
insert(_el$77, () => props.getTargetDescription(conflict.target), null);
|
|
224
|
+
effect(() => className(_el$77, styles().conflictItem));
|
|
225
|
+
return _el$77;
|
|
220
226
|
})();
|
|
221
227
|
}
|
|
222
228
|
}), null);
|
|
223
|
-
insert(_el$
|
|
229
|
+
insert(_el$71, createComponent(For, {
|
|
224
230
|
get each() {
|
|
225
231
|
return scopeConflicts();
|
|
226
232
|
},
|
|
227
233
|
children: (conflict) => (() => {
|
|
228
|
-
var _el$
|
|
229
|
-
_el$
|
|
230
|
-
insert(_el$
|
|
231
|
-
insert(_el$
|
|
232
|
-
insert(_el$
|
|
233
|
-
insert(_el$
|
|
234
|
-
effect(() => className(_el$
|
|
235
|
-
return _el$
|
|
234
|
+
var _el$88 = _tmpl$9(), _el$96 = _el$88.firstChild.nextSibling.nextSibling, _el$97 = _el$96.nextSibling.nextSibling, _el$98 = _el$97.nextSibling.nextSibling;
|
|
235
|
+
_el$98.nextSibling;
|
|
236
|
+
insert(_el$88, () => conflict.id, _el$96);
|
|
237
|
+
insert(_el$88, () => formatRegistration(conflict), _el$97);
|
|
238
|
+
insert(_el$88, () => conflict.options.eventType ?? "keydown", _el$98);
|
|
239
|
+
insert(_el$88, () => props.getTargetDescription(conflict.target), null);
|
|
240
|
+
effect(() => className(_el$88, styles().conflictItemScope));
|
|
241
|
+
return _el$88;
|
|
236
242
|
})()
|
|
237
243
|
}), null);
|
|
238
244
|
effect((_p$) => {
|
|
239
245
|
var _v$13 = styles().detailSection, _v$14 = styles().detailSectionHeader, _v$15 = styles().conflictList;
|
|
240
|
-
_v$13 !== _p$.e && className(_el$
|
|
241
|
-
_v$14 !== _p$.t && className(_el$
|
|
242
|
-
_v$15 !== _p$.a && className(_el$
|
|
246
|
+
_v$13 !== _p$.e && className(_el$66, _p$.e = _v$13);
|
|
247
|
+
_v$14 !== _p$.t && className(_el$67, _p$.t = _v$14);
|
|
248
|
+
_v$15 !== _p$.a && className(_el$71, _p$.a = _v$15);
|
|
243
249
|
return _p$;
|
|
244
250
|
}, {
|
|
245
251
|
e: void 0,
|
|
246
252
|
t: void 0,
|
|
247
253
|
a: void 0
|
|
248
254
|
});
|
|
249
|
-
return _el$
|
|
255
|
+
return _el$66;
|
|
250
256
|
}
|
|
251
257
|
}), null);
|
|
252
258
|
effect((_p$) => {
|
|
253
|
-
var _v$16 = styles().detailsGrid, _v$17 = styles().detailSection, _v$18 = styles().detailSectionHeader, _v$19 = styles().keyBreakdownSplitRow, _v$20 = styles().keyBreakdownSplitLeft, _v$21 = styles().keyBreakdown, _v$22 = styles().keyBreakdownSplitArrow, _v$23 = styles().keyBreakdownSplitRight, _v$24 = styles().detailSection, _v$25 = styles().detailSectionHeader, _v$26 = styles().detailSection, _v$27 = styles().detailSectionHeader, _v$28 = styles().optionRow, _v$29 = styles().optionLabel, _v$30 = styles().optionValue, _v$31 = styles().optionRow, _v$32 = styles().optionLabel, _v$33 = styles().optionValue, _v$34 = styles().detailSection, _v$35 = styles().detailSectionHeader, _v$36 = styles().optionRow, _v$37 = styles().optionLabel, _v$38 = reg().options.enabled !== false ? styles().optionValueTrue : styles().optionValueFalse, _v$39 = styles().optionRow, _v$40 = styles().optionLabel, _v$41 = styles().optionValue, _v$42 = styles().optionRow, _v$43 = styles().optionLabel, _v$44 = reg().options.preventDefault ? styles().optionValueTrue : styles().optionValueFalse, _v$
|
|
259
|
+
var _v$16 = styles().detailsGrid, _v$17 = styles().detailSection, _v$18 = styles().detailSectionHeader, _v$19 = styles().keyBreakdownSplitRow, _v$20 = styles().keyBreakdownSplitLeft, _v$21 = styles().keyBreakdown, _v$22 = styles().keyBreakdownSplitArrow, _v$23 = styles().keyBreakdownSplitRight, _v$24 = styles().detailSection, _v$25 = styles().detailSectionHeader, _v$26 = styles().detailSection, _v$27 = styles().detailSectionHeader, _v$28 = styles().optionRow, _v$29 = styles().optionLabel, _v$30 = styles().optionValue, _v$31 = styles().optionRow, _v$32 = styles().optionLabel, _v$33 = styles().optionValue, _v$34 = styles().detailSection, _v$35 = styles().detailSectionHeader, _v$36 = styles().optionRow, _v$37 = styles().optionLabel, _v$38 = reg().options.enabled !== false ? styles().optionValueTrue : styles().optionValueFalse, _v$39 = styles().optionRow, _v$40 = styles().optionLabel, _v$41 = styles().optionValue, _v$42 = styles().optionRow, _v$43 = styles().optionLabel, _v$44 = styles().optionValue, _v$45 = styles().optionRow, _v$46 = styles().optionLabel, _v$47 = reg().options.preventDefault ? styles().optionValueTrue : styles().optionValueFalse, _v$48 = styles().optionRow, _v$49 = styles().optionLabel, _v$50 = reg().options.stopPropagation ? styles().optionValueTrue : styles().optionValueFalse, _v$51 = styles().optionRow, _v$52 = styles().optionLabel, _v$53 = reg().options.ignoreInputs !== false ? styles().optionValueTrue : styles().optionValueFalse, _v$54 = styles().optionRow, _v$55 = styles().optionLabel, _v$56 = reg().options.requireReset ? styles().optionValueTrue : styles().optionValueFalse, _v$57 = styles().optionRow, _v$58 = styles().optionLabel, _v$59 = styles().optionValue, _v$60 = styles().optionRow, _v$61 = styles().optionLabel, _v$62 = reg().hasFired ? styles().optionValueTrue : styles().optionValueFalse;
|
|
254
260
|
_v$16 !== _p$.e && className(_el$14, _p$.e = _v$16);
|
|
255
261
|
_v$17 !== _p$.t && className(_el$15, _p$.t = _v$17);
|
|
256
262
|
_v$18 !== _p$.a && className(_el$16, _p$.a = _v$18);
|
|
@@ -277,24 +283,27 @@ function HotkeyDetails(props) {
|
|
|
277
283
|
_v$39 !== _p$.I && className(_el$39, _p$.I = _v$39);
|
|
278
284
|
_v$40 !== _p$.S && className(_el$40, _p$.S = _v$40);
|
|
279
285
|
_v$41 !== _p$.W && className(_el$41, _p$.W = _v$41);
|
|
280
|
-
_v$42 !== _p$.C && className(_el$
|
|
281
|
-
_v$43 !== _p$.B && className(_el$
|
|
282
|
-
_v$44 !== _p$.v && className(_el$
|
|
283
|
-
_v$45 !== _p$.k && className(_el$
|
|
284
|
-
_v$46 !== _p$.x && className(_el$
|
|
285
|
-
_v$47 !== _p$.j && className(_el$
|
|
286
|
-
_v$48 !== _p$.q && className(_el$
|
|
287
|
-
_v$49 !== _p$.z && className(_el$
|
|
288
|
-
_v$50 !== _p$.P && className(_el$
|
|
289
|
-
_v$51 !== _p$.H && className(_el$
|
|
290
|
-
_v$52 !== _p$.F && className(_el$
|
|
291
|
-
_v$53 !== _p$.M && className(_el$
|
|
292
|
-
_v$54 !== _p$.D && className(_el$
|
|
293
|
-
_v$55 !== _p$.R && className(_el$
|
|
294
|
-
_v$56 !== _p$.E && className(_el$
|
|
295
|
-
_v$57 !== _p$.L && className(_el$
|
|
296
|
-
_v$58 !== _p$.N && className(_el$
|
|
297
|
-
_v$59 !== _p$.G && className(_el$
|
|
286
|
+
_v$42 !== _p$.C && className(_el$45, _p$.C = _v$42);
|
|
287
|
+
_v$43 !== _p$.B && className(_el$46, _p$.B = _v$43);
|
|
288
|
+
_v$44 !== _p$.v && className(_el$47, _p$.v = _v$44);
|
|
289
|
+
_v$45 !== _p$.k && className(_el$48, _p$.k = _v$45);
|
|
290
|
+
_v$46 !== _p$.x && className(_el$49, _p$.x = _v$46);
|
|
291
|
+
_v$47 !== _p$.j && className(_el$50, _p$.j = _v$47);
|
|
292
|
+
_v$48 !== _p$.q && className(_el$51, _p$.q = _v$48);
|
|
293
|
+
_v$49 !== _p$.z && className(_el$52, _p$.z = _v$49);
|
|
294
|
+
_v$50 !== _p$.P && className(_el$53, _p$.P = _v$50);
|
|
295
|
+
_v$51 !== _p$.H && className(_el$54, _p$.H = _v$51);
|
|
296
|
+
_v$52 !== _p$.F && className(_el$55, _p$.F = _v$52);
|
|
297
|
+
_v$53 !== _p$.M && className(_el$56, _p$.M = _v$53);
|
|
298
|
+
_v$54 !== _p$.D && className(_el$57, _p$.D = _v$54);
|
|
299
|
+
_v$55 !== _p$.R && className(_el$58, _p$.R = _v$55);
|
|
300
|
+
_v$56 !== _p$.E && className(_el$59, _p$.E = _v$56);
|
|
301
|
+
_v$57 !== _p$.L && className(_el$60, _p$.L = _v$57);
|
|
302
|
+
_v$58 !== _p$.N && className(_el$61, _p$.N = _v$58);
|
|
303
|
+
_v$59 !== _p$.G && className(_el$62, _p$.G = _v$59);
|
|
304
|
+
_v$60 !== _p$.U && className(_el$63, _p$.U = _v$60);
|
|
305
|
+
_v$61 !== _p$.K && className(_el$64, _p$.K = _v$61);
|
|
306
|
+
_v$62 !== _p$.V && className(_el$65, _p$.V = _v$62);
|
|
298
307
|
return _p$;
|
|
299
308
|
}, {
|
|
300
309
|
e: void 0,
|
|
@@ -340,7 +349,10 @@ function HotkeyDetails(props) {
|
|
|
340
349
|
E: void 0,
|
|
341
350
|
L: void 0,
|
|
342
351
|
N: void 0,
|
|
343
|
-
G: void 0
|
|
352
|
+
G: void 0,
|
|
353
|
+
U: void 0,
|
|
354
|
+
K: void 0,
|
|
355
|
+
V: void 0
|
|
344
356
|
});
|
|
345
357
|
return _el$14;
|
|
346
358
|
})()];
|
|
@@ -360,60 +372,60 @@ function SequenceDetails(props) {
|
|
|
360
372
|
const sequenceCanonicalPlatform = createMemo(() => liveReg().options.platform ?? detectPlatform());
|
|
361
373
|
const styles = props.styles;
|
|
362
374
|
return [(() => {
|
|
363
|
-
var _el$
|
|
364
|
-
insert(_el$
|
|
375
|
+
var _el$99 = _tmpl$0(), _el$100 = _el$99.firstChild, _el$101 = _el$100.nextSibling, _el$102 = _el$101.firstChild, _el$103 = _el$102.nextSibling, _el$104 = _el$103.nextSibling, _el$105 = _el$104.nextSibling, _el$106 = _el$105.nextSibling, _el$107 = _el$106.nextSibling, _el$108 = _el$107.nextSibling, _el$109 = _el$108.nextSibling, _el$110 = _el$109.nextSibling, _el$111 = _el$110.nextSibling;
|
|
376
|
+
insert(_el$100, createComponent(For, {
|
|
365
377
|
get each() {
|
|
366
378
|
return liveReg().hotkey;
|
|
367
379
|
},
|
|
368
380
|
children: (step, i) => (() => {
|
|
369
|
-
var _el$
|
|
370
|
-
insert(_el$
|
|
381
|
+
var _el$165 = _tmpl$10(), _el$166 = _el$165.firstChild;
|
|
382
|
+
insert(_el$165, createComponent(Show, {
|
|
371
383
|
get when() {
|
|
372
384
|
return i() > 0;
|
|
373
385
|
},
|
|
374
386
|
children: " "
|
|
375
|
-
}), _el$
|
|
376
|
-
insert(_el$
|
|
377
|
-
effect(() => className(_el$
|
|
378
|
-
return _el$
|
|
387
|
+
}), _el$166);
|
|
388
|
+
insert(_el$166, () => formatForDisplay(step, { platform: sequenceCanonicalPlatform() }));
|
|
389
|
+
effect(() => className(_el$166, i() < matchedSteps() ? styles().sequenceStepMatched : void 0));
|
|
390
|
+
return _el$165;
|
|
379
391
|
})()
|
|
380
392
|
}));
|
|
381
|
-
insert(_el$
|
|
382
|
-
insert(_el$
|
|
383
|
-
insert(_el$
|
|
384
|
-
insert(_el$
|
|
393
|
+
insert(_el$103, () => liveReg().id);
|
|
394
|
+
insert(_el$105, () => getBindingKind(liveReg()));
|
|
395
|
+
insert(_el$107, () => liveReg().hotkey.join(" → "));
|
|
396
|
+
insert(_el$109, createComponent(For, {
|
|
385
397
|
get each() {
|
|
386
398
|
return liveReg().hotkey;
|
|
387
399
|
},
|
|
388
400
|
children: (step, i) => (() => {
|
|
389
|
-
var _el$
|
|
390
|
-
insert(_el$
|
|
401
|
+
var _el$167 = _tmpl$10(), _el$168 = _el$167.firstChild;
|
|
402
|
+
insert(_el$167, createComponent(Show, {
|
|
391
403
|
get when() {
|
|
392
404
|
return i() > 0;
|
|
393
405
|
},
|
|
394
406
|
children: " "
|
|
395
|
-
}), _el$
|
|
396
|
-
insert(_el$
|
|
397
|
-
effect(() => className(_el$
|
|
398
|
-
return _el$
|
|
407
|
+
}), _el$168);
|
|
408
|
+
insert(_el$168, () => formatForDisplay(step, { platform: sequenceCanonicalPlatform() }));
|
|
409
|
+
effect(() => className(_el$168, i() < matchedSteps() ? styles().sequenceStepMatched : void 0));
|
|
410
|
+
return _el$167;
|
|
399
411
|
})()
|
|
400
412
|
}));
|
|
401
|
-
insert(_el$
|
|
413
|
+
insert(_el$111, () => props.getTargetDescription(liveReg().target));
|
|
402
414
|
effect((_p$) => {
|
|
403
|
-
var _v$
|
|
404
|
-
_v$
|
|
405
|
-
_v$
|
|
406
|
-
_v$
|
|
407
|
-
_v$
|
|
408
|
-
_v$
|
|
409
|
-
_v$
|
|
410
|
-
_v$
|
|
411
|
-
_v$
|
|
412
|
-
_v$
|
|
413
|
-
_v$
|
|
414
|
-
_v$
|
|
415
|
-
_v$
|
|
416
|
-
_v$
|
|
415
|
+
var _v$66 = styles().stateHeader, _v$67 = styles().stateTitle, _v$68 = styles().infoGrid, _v$69 = styles().infoLabel, _v$70 = styles().infoValueMono, _v$71 = styles().infoLabel, _v$72 = styles().infoValueMono, _v$73 = styles().infoLabel, _v$74 = styles().infoValueMono, _v$75 = styles().infoLabel, _v$76 = styles().infoValueMono, _v$77 = styles().infoLabel, _v$78 = styles().infoValueMono;
|
|
416
|
+
_v$66 !== _p$.e && className(_el$99, _p$.e = _v$66);
|
|
417
|
+
_v$67 !== _p$.t && className(_el$100, _p$.t = _v$67);
|
|
418
|
+
_v$68 !== _p$.a && className(_el$101, _p$.a = _v$68);
|
|
419
|
+
_v$69 !== _p$.o && className(_el$102, _p$.o = _v$69);
|
|
420
|
+
_v$70 !== _p$.i && className(_el$103, _p$.i = _v$70);
|
|
421
|
+
_v$71 !== _p$.n && className(_el$104, _p$.n = _v$71);
|
|
422
|
+
_v$72 !== _p$.s && className(_el$105, _p$.s = _v$72);
|
|
423
|
+
_v$73 !== _p$.h && className(_el$106, _p$.h = _v$73);
|
|
424
|
+
_v$74 !== _p$.r && className(_el$107, _p$.r = _v$74);
|
|
425
|
+
_v$75 !== _p$.d && className(_el$108, _p$.d = _v$75);
|
|
426
|
+
_v$76 !== _p$.l && className(_el$109, _p$.l = _v$76);
|
|
427
|
+
_v$77 !== _p$.u && className(_el$110, _p$.u = _v$77);
|
|
428
|
+
_v$78 !== _p$.c && className(_el$111, _p$.c = _v$78);
|
|
417
429
|
return _p$;
|
|
418
430
|
}, {
|
|
419
431
|
e: void 0,
|
|
@@ -430,10 +442,12 @@ function SequenceDetails(props) {
|
|
|
430
442
|
u: void 0,
|
|
431
443
|
c: void 0
|
|
432
444
|
});
|
|
433
|
-
return _el$
|
|
445
|
+
return _el$99;
|
|
434
446
|
})(), (() => {
|
|
435
|
-
var _el$
|
|
436
|
-
|
|
447
|
+
var _el$112 = _tmpl$1(), _el$113 = _el$112.firstChild, _el$114 = _el$113.firstChild, _el$115 = _el$114.nextSibling, _el$116 = _el$115.nextSibling, _el$117 = _el$113.nextSibling, _el$118 = _el$117.firstChild, _el$119 = _el$117.nextSibling, _el$120 = _el$119.firstChild, _el$121 = _el$120.nextSibling, _el$122 = _el$121.firstChild, _el$123 = _el$122.firstChild, _el$124 = _el$123.nextSibling, _el$125 = _el$122.nextSibling, _el$126 = _el$125.firstChild, _el$127 = _el$126.nextSibling, _el$128 = _el$119.nextSibling, _el$129 = _el$128.firstChild, _el$131 = _el$129.nextSibling.firstChild, _el$132 = _el$131.firstChild, _el$133 = _el$132.nextSibling, _el$134 = _el$131.nextSibling, _el$135 = _el$134.firstChild, _el$136 = _el$135.nextSibling, _el$137 = _el$136.firstChild, _el$139 = _el$137.nextSibling;
|
|
448
|
+
_el$139.nextSibling;
|
|
449
|
+
var _el$140 = _el$134.nextSibling, _el$141 = _el$140.firstChild, _el$142 = _el$141.nextSibling, _el$143 = _el$140.nextSibling, _el$144 = _el$143.firstChild, _el$145 = _el$144.nextSibling, _el$146 = _el$145.firstChild, _el$147 = _el$143.nextSibling, _el$148 = _el$147.firstChild, _el$149 = _el$148.nextSibling, _el$150 = _el$147.nextSibling, _el$151 = _el$150.firstChild, _el$152 = _el$151.nextSibling, _el$153 = _el$150.nextSibling, _el$154 = _el$153.firstChild, _el$155 = _el$154.nextSibling, _el$156 = _el$153.nextSibling, _el$157 = _el$156.firstChild, _el$158 = _el$157.nextSibling;
|
|
450
|
+
insert(_el$115, createComponent(For, {
|
|
437
451
|
get each() {
|
|
438
452
|
return liveReg().hotkey;
|
|
439
453
|
},
|
|
@@ -442,18 +456,18 @@ function SequenceDetails(props) {
|
|
|
442
456
|
return i() > 0;
|
|
443
457
|
},
|
|
444
458
|
get children() {
|
|
445
|
-
var _el$
|
|
446
|
-
effect(() => className(_el$
|
|
447
|
-
return _el$
|
|
459
|
+
var _el$169 = _tmpl$11();
|
|
460
|
+
effect(() => className(_el$169, styles().keyBreakdownPlus));
|
|
461
|
+
return _el$169;
|
|
448
462
|
}
|
|
449
463
|
}), (() => {
|
|
450
|
-
var _el$
|
|
451
|
-
insert(_el$
|
|
452
|
-
effect(() => className(_el$
|
|
453
|
-
return _el$
|
|
464
|
+
var _el$170 = _tmpl$7();
|
|
465
|
+
insert(_el$170, () => formatForDisplay(step, { platform: sequenceCanonicalPlatform() }));
|
|
466
|
+
effect(() => className(_el$170, clsx(styles().keyCapLarge, i() < matchedSteps() && styles().keyCapLargeInProgress)));
|
|
467
|
+
return _el$170;
|
|
454
468
|
})()]
|
|
455
469
|
}));
|
|
456
|
-
insert(_el$
|
|
470
|
+
insert(_el$113, createComponent(For, {
|
|
457
471
|
get each() {
|
|
458
472
|
return liveReg().hotkey;
|
|
459
473
|
},
|
|
@@ -464,12 +478,12 @@ function SequenceDetails(props) {
|
|
|
464
478
|
parts: true
|
|
465
479
|
});
|
|
466
480
|
return (() => {
|
|
467
|
-
var _el$
|
|
468
|
-
_el$
|
|
469
|
-
var _el$
|
|
470
|
-
insert(_el$
|
|
471
|
-
insert(_el$
|
|
472
|
-
insert(_el$
|
|
481
|
+
var _el$171 = _tmpl$12(), _el$172 = _el$171.firstChild, _el$176 = _el$172.firstChild.nextSibling;
|
|
482
|
+
_el$176.nextSibling;
|
|
483
|
+
var _el$177 = _el$172.nextSibling, _el$178 = _el$177.firstChild, _el$179 = _el$178.firstChild, _el$180 = _el$178.nextSibling, _el$181 = _el$180.nextSibling;
|
|
484
|
+
insert(_el$172, () => stepIdx() + 1, _el$176);
|
|
485
|
+
insert(_el$172, () => stepParsed().code !== void 0 ? "Code" : "Key", null);
|
|
486
|
+
insert(_el$179, createComponent(For, {
|
|
473
487
|
get each() {
|
|
474
488
|
return stepParts();
|
|
475
489
|
},
|
|
@@ -478,18 +492,18 @@ function SequenceDetails(props) {
|
|
|
478
492
|
return i() > 0;
|
|
479
493
|
},
|
|
480
494
|
get children() {
|
|
481
|
-
var _el$
|
|
482
|
-
effect(() => className(_el$
|
|
483
|
-
return _el$
|
|
495
|
+
var _el$182 = _tmpl$6();
|
|
496
|
+
effect(() => className(_el$182, styles().keyBreakdownPlus));
|
|
497
|
+
return _el$182;
|
|
484
498
|
}
|
|
485
499
|
}), (() => {
|
|
486
|
-
var _el$
|
|
487
|
-
insert(_el$
|
|
488
|
-
effect(() => className(_el$
|
|
489
|
-
return _el$
|
|
500
|
+
var _el$183 = _tmpl$7();
|
|
501
|
+
insert(_el$183, part);
|
|
502
|
+
effect(() => className(_el$183, styles().keyCapLarge));
|
|
503
|
+
return _el$183;
|
|
490
504
|
})()]
|
|
491
505
|
}));
|
|
492
|
-
insert(_el$
|
|
506
|
+
insert(_el$181, createComponent(KeyBreakdownPlatformTable, {
|
|
493
507
|
getParsed: stepParsed,
|
|
494
508
|
getCanonicalPlatform: () => sequenceCanonicalPlatform(),
|
|
495
509
|
get styles() {
|
|
@@ -497,14 +511,14 @@ function SequenceDetails(props) {
|
|
|
497
511
|
}
|
|
498
512
|
}));
|
|
499
513
|
effect((_p$) => {
|
|
500
|
-
var _v$
|
|
501
|
-
_v$
|
|
502
|
-
_v$
|
|
503
|
-
_v$
|
|
504
|
-
_v$
|
|
505
|
-
_v$
|
|
506
|
-
_v$
|
|
507
|
-
_v$
|
|
514
|
+
var _v$123 = styles().sequenceChordDetail, _v$124 = styles().keyBreakdownSubHeader, _v$125 = styles().keyBreakdownSplitRow, _v$126 = styles().keyBreakdownSplitLeft, _v$127 = styles().keyBreakdown, _v$128 = styles().keyBreakdownSplitArrow, _v$129 = styles().keyBreakdownSplitRight;
|
|
515
|
+
_v$123 !== _p$.e && className(_el$171, _p$.e = _v$123);
|
|
516
|
+
_v$124 !== _p$.t && className(_el$172, _p$.t = _v$124);
|
|
517
|
+
_v$125 !== _p$.a && className(_el$177, _p$.a = _v$125);
|
|
518
|
+
_v$126 !== _p$.o && className(_el$178, _p$.o = _v$126);
|
|
519
|
+
_v$127 !== _p$.i && className(_el$179, _p$.i = _v$127);
|
|
520
|
+
_v$128 !== _p$.n && className(_el$180, _p$.n = _v$128);
|
|
521
|
+
_v$129 !== _p$.s && className(_el$181, _p$.s = _v$129);
|
|
508
522
|
return _p$;
|
|
509
523
|
}, {
|
|
510
524
|
e: void 0,
|
|
@@ -515,16 +529,16 @@ function SequenceDetails(props) {
|
|
|
515
529
|
n: void 0,
|
|
516
530
|
s: void 0
|
|
517
531
|
});
|
|
518
|
-
return _el$
|
|
532
|
+
return _el$171;
|
|
519
533
|
})();
|
|
520
534
|
}
|
|
521
535
|
}), null);
|
|
522
|
-
insert(_el$
|
|
536
|
+
insert(_el$117, createComponent(ActionButtons, { get registration() {
|
|
523
537
|
return liveReg();
|
|
524
538
|
} }), null);
|
|
525
|
-
insert(_el$
|
|
526
|
-
insert(_el$
|
|
527
|
-
insert(_el$
|
|
539
|
+
insert(_el$124, () => liveReg().options.meta?.name ?? "—");
|
|
540
|
+
insert(_el$127, () => liveReg().options.meta?.description ?? "—");
|
|
541
|
+
insert(_el$121, createComponent(Show, {
|
|
528
542
|
get when() {
|
|
529
543
|
return memo(() => !!liveReg().options.meta)() && Object.keys(liveReg().options.meta).filter((k) => k !== "name" && k !== "description").length > 0;
|
|
530
544
|
},
|
|
@@ -534,127 +548,132 @@ function SequenceDetails(props) {
|
|
|
534
548
|
return Object.entries(liveReg().options.meta ?? {}).filter(([k]) => k !== "name" && k !== "description");
|
|
535
549
|
},
|
|
536
550
|
children: ([key, value]) => (() => {
|
|
537
|
-
var _el$
|
|
538
|
-
insert(_el$
|
|
539
|
-
insert(_el$
|
|
551
|
+
var _el$184 = _tmpl$2(), _el$185 = _el$184.firstChild, _el$186 = _el$185.nextSibling;
|
|
552
|
+
insert(_el$185, key);
|
|
553
|
+
insert(_el$186, () => String(value));
|
|
540
554
|
effect((_p$) => {
|
|
541
|
-
var _v$
|
|
542
|
-
_v$
|
|
543
|
-
_v$
|
|
544
|
-
_v$
|
|
555
|
+
var _v$130 = styles().optionRow, _v$131 = styles().optionLabel, _v$132 = styles().optionValue;
|
|
556
|
+
_v$130 !== _p$.e && className(_el$184, _p$.e = _v$130);
|
|
557
|
+
_v$131 !== _p$.t && className(_el$185, _p$.t = _v$131);
|
|
558
|
+
_v$132 !== _p$.a && className(_el$186, _p$.a = _v$132);
|
|
545
559
|
return _p$;
|
|
546
560
|
}, {
|
|
547
561
|
e: void 0,
|
|
548
562
|
t: void 0,
|
|
549
563
|
a: void 0
|
|
550
564
|
});
|
|
551
|
-
return _el$
|
|
565
|
+
return _el$184;
|
|
552
566
|
})()
|
|
553
567
|
});
|
|
554
568
|
}
|
|
555
569
|
}), null);
|
|
556
|
-
insert(_el$
|
|
557
|
-
insert(_el$
|
|
558
|
-
insert(_el$
|
|
559
|
-
insert(_el$
|
|
560
|
-
insert(_el$
|
|
561
|
-
insert(_el$
|
|
562
|
-
insert(_el$
|
|
563
|
-
insert(_el$
|
|
570
|
+
insert(_el$133, () => String(liveReg().options.enabled !== false));
|
|
571
|
+
insert(_el$136, () => liveReg().options.scope ?? "global", _el$137);
|
|
572
|
+
insert(_el$136, () => getScopeStatus(liveReg().options.scope ?? "global", props.state.scopes()), _el$139);
|
|
573
|
+
insert(_el$142, () => liveReg().options.eventType ?? "keydown");
|
|
574
|
+
insert(_el$145, () => liveReg().options.timeout ?? 1e3, _el$146);
|
|
575
|
+
insert(_el$149, () => String(!!liveReg().options.preventDefault));
|
|
576
|
+
insert(_el$152, () => String(!!liveReg().options.stopPropagation));
|
|
577
|
+
insert(_el$155, () => String(liveReg().options.ignoreInputs ?? "auto"));
|
|
578
|
+
insert(_el$158, conflictBehavior);
|
|
579
|
+
insert(_el$112, createComponent(Show, {
|
|
564
580
|
get when() {
|
|
565
581
|
return allConflicts().length > 0;
|
|
566
582
|
},
|
|
567
583
|
get children() {
|
|
568
|
-
var _el$
|
|
569
|
-
_el$
|
|
570
|
-
var _el$
|
|
571
|
-
insert(_el$
|
|
572
|
-
insert(_el$
|
|
584
|
+
var _el$159 = _tmpl$4(), _el$160 = _el$159.firstChild, _el$163 = _el$160.firstChild.nextSibling;
|
|
585
|
+
_el$163.nextSibling;
|
|
586
|
+
var _el$164 = _el$160.nextSibling;
|
|
587
|
+
insert(_el$160, () => allConflicts().length, _el$163);
|
|
588
|
+
insert(_el$164, createComponent(For, {
|
|
573
589
|
get each() {
|
|
574
590
|
return targetConflicts();
|
|
575
591
|
},
|
|
576
592
|
children: (conflict) => {
|
|
577
593
|
return (() => {
|
|
578
|
-
var _el$
|
|
579
|
-
_el$
|
|
580
|
-
insert(_el$
|
|
581
|
-
insert(_el$
|
|
582
|
-
insert(_el$
|
|
583
|
-
insert(_el$
|
|
584
|
-
effect(() => className(_el$
|
|
585
|
-
return _el$
|
|
594
|
+
var _el$187 = _tmpl$8(), _el$195 = _el$187.firstChild.nextSibling.nextSibling, _el$196 = _el$195.nextSibling.nextSibling, _el$197 = _el$196.nextSibling.nextSibling;
|
|
595
|
+
_el$197.nextSibling;
|
|
596
|
+
insert(_el$187, () => conflict.id, _el$195);
|
|
597
|
+
insert(_el$187, () => formatRegistration(conflict), _el$196);
|
|
598
|
+
insert(_el$187, () => conflict.options.eventType ?? "keydown", _el$197);
|
|
599
|
+
insert(_el$187, () => props.getTargetDescription(conflict.target), null);
|
|
600
|
+
effect(() => className(_el$187, styles().conflictItem));
|
|
601
|
+
return _el$187;
|
|
586
602
|
})();
|
|
587
603
|
}
|
|
588
604
|
}), null);
|
|
589
|
-
insert(_el$
|
|
605
|
+
insert(_el$164, createComponent(For, {
|
|
590
606
|
get each() {
|
|
591
607
|
return scopeConflicts();
|
|
592
608
|
},
|
|
593
609
|
children: (conflict) => (() => {
|
|
594
|
-
var _el$
|
|
595
|
-
_el$
|
|
596
|
-
insert(_el$
|
|
597
|
-
insert(_el$
|
|
598
|
-
insert(_el$
|
|
599
|
-
insert(_el$
|
|
600
|
-
effect(() => className(_el$
|
|
601
|
-
return _el$
|
|
610
|
+
var _el$198 = _tmpl$9(), _el$206 = _el$198.firstChild.nextSibling.nextSibling, _el$207 = _el$206.nextSibling.nextSibling, _el$208 = _el$207.nextSibling.nextSibling;
|
|
611
|
+
_el$208.nextSibling;
|
|
612
|
+
insert(_el$198, () => conflict.id, _el$206);
|
|
613
|
+
insert(_el$198, () => formatRegistration(conflict), _el$207);
|
|
614
|
+
insert(_el$198, () => conflict.options.eventType ?? "keydown", _el$208);
|
|
615
|
+
insert(_el$198, () => props.getTargetDescription(conflict.target), null);
|
|
616
|
+
effect(() => className(_el$198, styles().conflictItemScope));
|
|
617
|
+
return _el$198;
|
|
602
618
|
})()
|
|
603
619
|
}), null);
|
|
604
620
|
effect((_p$) => {
|
|
605
|
-
var _v$
|
|
606
|
-
_v$
|
|
607
|
-
_v$
|
|
608
|
-
_v$
|
|
621
|
+
var _v$79 = styles().detailSection, _v$80 = styles().detailSectionHeader, _v$81 = styles().conflictList;
|
|
622
|
+
_v$79 !== _p$.e && className(_el$159, _p$.e = _v$79);
|
|
623
|
+
_v$80 !== _p$.t && className(_el$160, _p$.t = _v$80);
|
|
624
|
+
_v$81 !== _p$.a && className(_el$164, _p$.a = _v$81);
|
|
609
625
|
return _p$;
|
|
610
626
|
}, {
|
|
611
627
|
e: void 0,
|
|
612
628
|
t: void 0,
|
|
613
629
|
a: void 0
|
|
614
630
|
});
|
|
615
|
-
return _el$
|
|
631
|
+
return _el$159;
|
|
616
632
|
}
|
|
617
633
|
}), null);
|
|
618
634
|
effect((_p$) => {
|
|
619
|
-
var _v$
|
|
620
|
-
_v$
|
|
621
|
-
_v$
|
|
622
|
-
_v$
|
|
623
|
-
_v$
|
|
624
|
-
_v$
|
|
625
|
-
_v$
|
|
626
|
-
_v$
|
|
627
|
-
_v$
|
|
628
|
-
_v$
|
|
629
|
-
_v$
|
|
630
|
-
_v$
|
|
631
|
-
_v$
|
|
632
|
-
_v$
|
|
633
|
-
_v$
|
|
634
|
-
_v$
|
|
635
|
-
_v$
|
|
636
|
-
_v$
|
|
637
|
-
_v$
|
|
638
|
-
_v$
|
|
639
|
-
_v$
|
|
640
|
-
_v$
|
|
641
|
-
_v$
|
|
642
|
-
_v$
|
|
643
|
-
_v$
|
|
644
|
-
_v$
|
|
645
|
-
_v$
|
|
646
|
-
_v$
|
|
647
|
-
_v$
|
|
648
|
-
_v$
|
|
649
|
-
_v$
|
|
650
|
-
_v$
|
|
651
|
-
_v$
|
|
652
|
-
_v$
|
|
653
|
-
_v$
|
|
654
|
-
_v$
|
|
655
|
-
_v$
|
|
656
|
-
_v$
|
|
657
|
-
_v$
|
|
635
|
+
var _v$82 = styles().detailsGrid, _v$83 = styles().detailSection, _v$84 = styles().detailSectionHeader, _v$85 = styles().keyBreakdown, _v$86 = styles().keyBreakdownSubHeader, _v$87 = styles().detailSection, _v$88 = styles().detailSectionHeader, _v$89 = styles().detailSection, _v$90 = styles().detailSectionHeader, _v$91 = styles().optionRow, _v$92 = styles().optionLabel, _v$93 = styles().optionValue, _v$94 = styles().optionRow, _v$95 = styles().optionLabel, _v$96 = styles().optionValue, _v$97 = styles().detailSection, _v$98 = styles().detailSectionHeader, _v$99 = styles().optionRow, _v$100 = styles().optionLabel, _v$101 = liveReg().options.enabled !== false ? styles().optionValueTrue : styles().optionValueFalse, _v$102 = styles().optionRow, _v$103 = styles().optionLabel, _v$104 = styles().optionValue, _v$105 = styles().optionRow, _v$106 = styles().optionLabel, _v$107 = styles().optionValue, _v$108 = styles().optionRow, _v$109 = styles().optionLabel, _v$110 = styles().optionValue, _v$111 = styles().optionRow, _v$112 = styles().optionLabel, _v$113 = liveReg().options.preventDefault ? styles().optionValueTrue : styles().optionValueFalse, _v$114 = styles().optionRow, _v$115 = styles().optionLabel, _v$116 = liveReg().options.stopPropagation ? styles().optionValueTrue : styles().optionValueFalse, _v$117 = styles().optionRow, _v$118 = styles().optionLabel, _v$119 = liveReg().options.ignoreInputs !== false ? styles().optionValueTrue : styles().optionValueFalse, _v$120 = styles().optionRow, _v$121 = styles().optionLabel, _v$122 = styles().optionValue;
|
|
636
|
+
_v$82 !== _p$.e && className(_el$112, _p$.e = _v$82);
|
|
637
|
+
_v$83 !== _p$.t && className(_el$113, _p$.t = _v$83);
|
|
638
|
+
_v$84 !== _p$.a && className(_el$114, _p$.a = _v$84);
|
|
639
|
+
_v$85 !== _p$.o && className(_el$115, _p$.o = _v$85);
|
|
640
|
+
_v$86 !== _p$.i && className(_el$116, _p$.i = _v$86);
|
|
641
|
+
_v$87 !== _p$.n && className(_el$117, _p$.n = _v$87);
|
|
642
|
+
_v$88 !== _p$.s && className(_el$118, _p$.s = _v$88);
|
|
643
|
+
_v$89 !== _p$.h && className(_el$119, _p$.h = _v$89);
|
|
644
|
+
_v$90 !== _p$.r && className(_el$120, _p$.r = _v$90);
|
|
645
|
+
_v$91 !== _p$.d && className(_el$122, _p$.d = _v$91);
|
|
646
|
+
_v$92 !== _p$.l && className(_el$123, _p$.l = _v$92);
|
|
647
|
+
_v$93 !== _p$.u && className(_el$124, _p$.u = _v$93);
|
|
648
|
+
_v$94 !== _p$.c && className(_el$125, _p$.c = _v$94);
|
|
649
|
+
_v$95 !== _p$.w && className(_el$126, _p$.w = _v$95);
|
|
650
|
+
_v$96 !== _p$.m && className(_el$127, _p$.m = _v$96);
|
|
651
|
+
_v$97 !== _p$.f && className(_el$128, _p$.f = _v$97);
|
|
652
|
+
_v$98 !== _p$.y && className(_el$129, _p$.y = _v$98);
|
|
653
|
+
_v$99 !== _p$.g && className(_el$131, _p$.g = _v$99);
|
|
654
|
+
_v$100 !== _p$.p && className(_el$132, _p$.p = _v$100);
|
|
655
|
+
_v$101 !== _p$.b && className(_el$133, _p$.b = _v$101);
|
|
656
|
+
_v$102 !== _p$.T && className(_el$134, _p$.T = _v$102);
|
|
657
|
+
_v$103 !== _p$.A && className(_el$135, _p$.A = _v$103);
|
|
658
|
+
_v$104 !== _p$.O && className(_el$136, _p$.O = _v$104);
|
|
659
|
+
_v$105 !== _p$.I && className(_el$140, _p$.I = _v$105);
|
|
660
|
+
_v$106 !== _p$.S && className(_el$141, _p$.S = _v$106);
|
|
661
|
+
_v$107 !== _p$.W && className(_el$142, _p$.W = _v$107);
|
|
662
|
+
_v$108 !== _p$.C && className(_el$143, _p$.C = _v$108);
|
|
663
|
+
_v$109 !== _p$.B && className(_el$144, _p$.B = _v$109);
|
|
664
|
+
_v$110 !== _p$.v && className(_el$145, _p$.v = _v$110);
|
|
665
|
+
_v$111 !== _p$.k && className(_el$147, _p$.k = _v$111);
|
|
666
|
+
_v$112 !== _p$.x && className(_el$148, _p$.x = _v$112);
|
|
667
|
+
_v$113 !== _p$.j && className(_el$149, _p$.j = _v$113);
|
|
668
|
+
_v$114 !== _p$.q && className(_el$150, _p$.q = _v$114);
|
|
669
|
+
_v$115 !== _p$.z && className(_el$151, _p$.z = _v$115);
|
|
670
|
+
_v$116 !== _p$.P && className(_el$152, _p$.P = _v$116);
|
|
671
|
+
_v$117 !== _p$.H && className(_el$153, _p$.H = _v$117);
|
|
672
|
+
_v$118 !== _p$.F && className(_el$154, _p$.F = _v$118);
|
|
673
|
+
_v$119 !== _p$.M && className(_el$155, _p$.M = _v$119);
|
|
674
|
+
_v$120 !== _p$.D && className(_el$156, _p$.D = _v$120);
|
|
675
|
+
_v$121 !== _p$.R && className(_el$157, _p$.R = _v$121);
|
|
676
|
+
_v$122 !== _p$.E && className(_el$158, _p$.E = _v$122);
|
|
658
677
|
return _p$;
|
|
659
678
|
}, {
|
|
660
679
|
e: void 0,
|
|
@@ -694,9 +713,12 @@ function SequenceDetails(props) {
|
|
|
694
713
|
P: void 0,
|
|
695
714
|
H: void 0,
|
|
696
715
|
F: void 0,
|
|
697
|
-
M: void 0
|
|
716
|
+
M: void 0,
|
|
717
|
+
D: void 0,
|
|
718
|
+
R: void 0,
|
|
719
|
+
E: void 0
|
|
698
720
|
});
|
|
699
|
-
return _el$
|
|
721
|
+
return _el$112;
|
|
700
722
|
})()];
|
|
701
723
|
}
|
|
702
724
|
function AppHotkeyDetails(props) {
|
|
@@ -704,43 +726,43 @@ function AppHotkeyDetails(props) {
|
|
|
704
726
|
const appHotkey = () => props.item.appHotkey;
|
|
705
727
|
const format = (hotkey) => hotkey ? formatForDisplay(hotkey, { sequenceSeparator: " → " }) : "Unassigned";
|
|
706
728
|
const row = (label, value) => (() => {
|
|
707
|
-
var _el$
|
|
708
|
-
insert(_el$
|
|
709
|
-
insert(_el$
|
|
729
|
+
var _el$209 = _tmpl$2(), _el$210 = _el$209.firstChild, _el$211 = _el$210.nextSibling;
|
|
730
|
+
insert(_el$210, label);
|
|
731
|
+
insert(_el$211, value);
|
|
710
732
|
effect((_p$) => {
|
|
711
|
-
var _v$
|
|
712
|
-
_v$
|
|
713
|
-
_v$
|
|
714
|
-
_v$
|
|
733
|
+
var _v$133 = styles().optionRow, _v$134 = styles().optionLabel, _v$135 = styles().optionValue;
|
|
734
|
+
_v$133 !== _p$.e && className(_el$209, _p$.e = _v$133);
|
|
735
|
+
_v$134 !== _p$.t && className(_el$210, _p$.t = _v$134);
|
|
736
|
+
_v$135 !== _p$.a && className(_el$211, _p$.a = _v$135);
|
|
715
737
|
return _p$;
|
|
716
738
|
}, {
|
|
717
739
|
e: void 0,
|
|
718
740
|
t: void 0,
|
|
719
741
|
a: void 0
|
|
720
742
|
});
|
|
721
|
-
return _el$
|
|
743
|
+
return _el$209;
|
|
722
744
|
})();
|
|
723
745
|
return [(() => {
|
|
724
|
-
var _el$
|
|
725
|
-
insert(_el$
|
|
726
|
-
insert(_el$
|
|
727
|
-
insert(_el$
|
|
728
|
-
insert(_el$
|
|
729
|
-
insert(_el$
|
|
730
|
-
insert(_el$
|
|
746
|
+
var _el$212 = _tmpl$13(), _el$213 = _el$212.firstChild, _el$214 = _el$213.nextSibling, _el$215 = _el$214.firstChild, _el$216 = _el$215.nextSibling, _el$217 = _el$216.nextSibling, _el$218 = _el$217.nextSibling, _el$219 = _el$218.nextSibling, _el$220 = _el$219.nextSibling, _el$221 = _el$220.nextSibling, _el$222 = _el$221.nextSibling;
|
|
747
|
+
insert(_el$213, () => format(appHotkey().hotkey));
|
|
748
|
+
insert(_el$216, () => appHotkey().id);
|
|
749
|
+
insert(_el$218, () => props.item.status);
|
|
750
|
+
insert(_el$220, () => format(appHotkey().defaultHotkey), null);
|
|
751
|
+
insert(_el$220, () => props.item.isCustom ? " (customized)" : "", null);
|
|
752
|
+
insert(_el$222, () => appHotkey().scope ?? "global");
|
|
731
753
|
effect((_p$) => {
|
|
732
|
-
var _v$
|
|
733
|
-
_v$
|
|
734
|
-
_v$
|
|
735
|
-
_v$
|
|
736
|
-
_v$
|
|
737
|
-
_v$
|
|
738
|
-
_v$
|
|
739
|
-
_v$
|
|
740
|
-
_v$
|
|
741
|
-
_v$
|
|
742
|
-
_v$
|
|
743
|
-
_v$
|
|
754
|
+
var _v$136 = styles().stateHeader, _v$137 = styles().stateTitle, _v$138 = styles().infoGrid, _v$139 = styles().infoLabel, _v$140 = styles().infoValueMono, _v$141 = styles().infoLabel, _v$142 = styles().infoValueMono, _v$143 = styles().infoLabel, _v$144 = styles().infoValueMono, _v$145 = styles().infoLabel, _v$146 = styles().infoValueMono;
|
|
755
|
+
_v$136 !== _p$.e && className(_el$212, _p$.e = _v$136);
|
|
756
|
+
_v$137 !== _p$.t && className(_el$213, _p$.t = _v$137);
|
|
757
|
+
_v$138 !== _p$.a && className(_el$214, _p$.a = _v$138);
|
|
758
|
+
_v$139 !== _p$.o && className(_el$215, _p$.o = _v$139);
|
|
759
|
+
_v$140 !== _p$.i && className(_el$216, _p$.i = _v$140);
|
|
760
|
+
_v$141 !== _p$.n && className(_el$217, _p$.n = _v$141);
|
|
761
|
+
_v$142 !== _p$.s && className(_el$218, _p$.s = _v$142);
|
|
762
|
+
_v$143 !== _p$.h && className(_el$219, _p$.h = _v$143);
|
|
763
|
+
_v$144 !== _p$.r && className(_el$220, _p$.r = _v$144);
|
|
764
|
+
_v$145 !== _p$.d && className(_el$221, _p$.d = _v$145);
|
|
765
|
+
_v$146 !== _p$.l && className(_el$222, _p$.l = _v$146);
|
|
744
766
|
return _p$;
|
|
745
767
|
}, {
|
|
746
768
|
e: void 0,
|
|
@@ -755,16 +777,16 @@ function AppHotkeyDetails(props) {
|
|
|
755
777
|
d: void 0,
|
|
756
778
|
l: void 0
|
|
757
779
|
});
|
|
758
|
-
return _el$
|
|
780
|
+
return _el$212;
|
|
759
781
|
})(), (() => {
|
|
760
|
-
var _el$
|
|
761
|
-
insert(_el$
|
|
782
|
+
var _el$223 = _tmpl$14(), _el$224 = _el$223.firstChild, _el$225 = _el$224.firstChild, _el$226 = _el$225.nextSibling, _el$227 = _el$224.nextSibling, _el$228 = _el$227.firstChild, _el$229 = _el$228.nextSibling;
|
|
783
|
+
insert(_el$226, createComponent(For, {
|
|
762
784
|
get each() {
|
|
763
785
|
return Object.entries(appHotkey().meta ?? {});
|
|
764
786
|
},
|
|
765
787
|
children: ([key, value]) => row(key, String(value))
|
|
766
788
|
}), null);
|
|
767
|
-
insert(_el$
|
|
789
|
+
insert(_el$226, createComponent(Show, {
|
|
768
790
|
get when() {
|
|
769
791
|
return !appHotkey().meta;
|
|
770
792
|
},
|
|
@@ -772,13 +794,13 @@ function AppHotkeyDetails(props) {
|
|
|
772
794
|
return row("meta", "—");
|
|
773
795
|
}
|
|
774
796
|
}), null);
|
|
775
|
-
insert(_el$
|
|
797
|
+
insert(_el$229, createComponent(For, {
|
|
776
798
|
get each() {
|
|
777
799
|
return Object.entries(appHotkey().options ?? {});
|
|
778
800
|
},
|
|
779
801
|
children: ([key, value]) => row(key, String(value))
|
|
780
802
|
}), null);
|
|
781
|
-
insert(_el$
|
|
803
|
+
insert(_el$229, createComponent(Show, {
|
|
782
804
|
get when() {
|
|
783
805
|
return !appHotkey().options;
|
|
784
806
|
},
|
|
@@ -787,12 +809,12 @@ function AppHotkeyDetails(props) {
|
|
|
787
809
|
}
|
|
788
810
|
}), null);
|
|
789
811
|
effect((_p$) => {
|
|
790
|
-
var _v$
|
|
791
|
-
_v$
|
|
792
|
-
_v$
|
|
793
|
-
_v$
|
|
794
|
-
_v$
|
|
795
|
-
_v$
|
|
812
|
+
var _v$147 = styles().detailsGrid, _v$148 = styles().detailSection, _v$149 = styles().detailSectionHeader, _v$150 = styles().detailSection, _v$151 = styles().detailSectionHeader;
|
|
813
|
+
_v$147 !== _p$.e && className(_el$223, _p$.e = _v$147);
|
|
814
|
+
_v$148 !== _p$.t && className(_el$224, _p$.t = _v$148);
|
|
815
|
+
_v$149 !== _p$.a && className(_el$225, _p$.a = _v$149);
|
|
816
|
+
_v$150 !== _p$.o && className(_el$227, _p$.o = _v$150);
|
|
817
|
+
_v$151 !== _p$.i && className(_el$228, _p$.i = _v$151);
|
|
796
818
|
return _p$;
|
|
797
819
|
}, {
|
|
798
820
|
e: void 0,
|
|
@@ -801,48 +823,61 @@ function AppHotkeyDetails(props) {
|
|
|
801
823
|
o: void 0,
|
|
802
824
|
i: void 0
|
|
803
825
|
});
|
|
804
|
-
return _el$
|
|
826
|
+
return _el$223;
|
|
805
827
|
})()];
|
|
806
828
|
}
|
|
807
829
|
function DetailsPanel(props) {
|
|
808
830
|
const styles = useStyles();
|
|
809
831
|
const state = useHotkeysDevtoolsState();
|
|
832
|
+
const selectionKey = createMemo(() => {
|
|
833
|
+
const selection = props.selection();
|
|
834
|
+
if (!selection) return null;
|
|
835
|
+
return selection.type === "appHotkey" ? `app:${selection.item.appHotkey.id}` : `${selection.registration.kind}:${selection.registration.id}`;
|
|
836
|
+
});
|
|
837
|
+
const appHotkeyItem = () => {
|
|
838
|
+
const selection = props.selection();
|
|
839
|
+
return selection?.type === "appHotkey" ? selection.item : void 0;
|
|
840
|
+
};
|
|
841
|
+
const registration = () => {
|
|
842
|
+
const selection = props.selection();
|
|
843
|
+
return selection?.type === "registration" ? selection.registration : void 0;
|
|
844
|
+
};
|
|
810
845
|
return (() => {
|
|
811
|
-
var _el$
|
|
812
|
-
insert(_el$
|
|
846
|
+
var _el$230 = _tmpl$();
|
|
847
|
+
insert(_el$230, createComponent(Show, {
|
|
813
848
|
get when() {
|
|
814
|
-
return
|
|
849
|
+
return selectionKey();
|
|
815
850
|
},
|
|
851
|
+
keyed: true,
|
|
816
852
|
get fallback() {
|
|
817
853
|
return (() => {
|
|
818
|
-
var _el$
|
|
819
|
-
effect(() => className(_el$
|
|
820
|
-
return _el$
|
|
854
|
+
var _el$231 = _tmpl$15();
|
|
855
|
+
effect(() => className(_el$231, styles().noSelection));
|
|
856
|
+
return _el$231;
|
|
821
857
|
})();
|
|
822
858
|
},
|
|
823
|
-
children: (
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
}
|
|
859
|
+
children: (key) => key.startsWith("app:") ? createComponent(AppHotkeyDetails, {
|
|
860
|
+
get item() {
|
|
861
|
+
return appHotkeyItem();
|
|
862
|
+
},
|
|
863
|
+
styles
|
|
864
|
+
}) : key.startsWith("sequence:") ? createComponent(SequenceDetails, {
|
|
865
|
+
get registration() {
|
|
866
|
+
return registration();
|
|
867
|
+
},
|
|
868
|
+
state,
|
|
869
|
+
getTargetDescription,
|
|
870
|
+
styles
|
|
871
|
+
}) : createComponent(HotkeyDetails, {
|
|
872
|
+
get registration() {
|
|
873
|
+
return registration();
|
|
874
|
+
},
|
|
875
|
+
getTargetDescription,
|
|
876
|
+
styles
|
|
877
|
+
})
|
|
843
878
|
}));
|
|
844
|
-
effect(() => className(_el$
|
|
845
|
-
return _el$
|
|
879
|
+
effect(() => className(_el$230, styles().stateDetails));
|
|
880
|
+
return _el$230;
|
|
846
881
|
})();
|
|
847
882
|
}
|
|
848
883
|
|