fix: expand arrow key guard for form controls and wire i18n for fixed shortcuts
- Add HTMLSelectElement and contentEditable to the arrow key input guard to prevent intercepting native keyboard behavior on form controls - Add i18nKey field to FixedShortcut interface and wire up i18n lookups in ShortcutsConfigDialog and KeyboardShortcutsHelp so fixed shortcut labels are properly localized
This commit is contained in:
@@ -37,8 +37,10 @@ export function KeyboardShortcutsHelp() {
|
||||
|
||||
<div className="pt-1 border-t border-white/5 mt-1 space-y-1.5">
|
||||
{FIXED_SHORTCUTS.map((fixed) => (
|
||||
<div key={fixed.label} className="flex items-center justify-between">
|
||||
<span className="text-slate-400">{fixed.label}</span>
|
||||
<div key={fixed.i18nKey} className="flex items-center justify-between">
|
||||
<span className="text-slate-400">
|
||||
{t(`fixedActions.${fixed.i18nKey}`, { defaultValue: fixed.label })}
|
||||
</span>
|
||||
<kbd className="px-1 py-0.5 bg-white/5 border border-white/10 rounded text-[#34B27B] font-mono">
|
||||
{isMac
|
||||
? fixed.display
|
||||
|
||||
@@ -197,12 +197,14 @@ export function ShortcutsConfigDialog() {
|
||||
<p className="text-[10px] text-slate-500 mb-2 uppercase tracking-wide font-semibold">
|
||||
{t("fixed")}
|
||||
</p>
|
||||
{FIXED_SHORTCUTS.map(({ label, display }) => (
|
||||
{FIXED_SHORTCUTS.map(({ i18nKey, label, display }) => (
|
||||
<div
|
||||
key={label}
|
||||
key={i18nKey}
|
||||
className="flex items-center justify-between py-1.5 px-1 border-b border-white/5 last:border-0"
|
||||
>
|
||||
<span className="text-sm text-slate-400">{label}</span>
|
||||
<span className="text-sm text-slate-400">
|
||||
{t(`fixedActions.${i18nKey}`, { defaultValue: label })}
|
||||
</span>
|
||||
<kbd className="px-2 py-1 bg-white/5 border border-white/10 rounded text-xs font-mono text-slate-400 min-w-[90px] text-center">
|
||||
{display}
|
||||
</kbd>
|
||||
|
||||
@@ -940,7 +940,12 @@ export default function VideoEditor() {
|
||||
!e.altKey
|
||||
) {
|
||||
const target = e.target;
|
||||
if (target instanceof HTMLInputElement || target instanceof HTMLTextAreaElement) {
|
||||
if (
|
||||
target instanceof HTMLInputElement ||
|
||||
target instanceof HTMLTextAreaElement ||
|
||||
target instanceof HTMLSelectElement ||
|
||||
(target instanceof HTMLElement && target.isContentEditable)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
e.preventDefault();
|
||||
|
||||
+25
-6
@@ -21,14 +21,16 @@ export interface ShortcutBinding {
|
||||
export type ShortcutsConfig = Record<ShortcutAction, ShortcutBinding>;
|
||||
|
||||
export interface FixedShortcut {
|
||||
i18nKey: string;
|
||||
label: string;
|
||||
display: string;
|
||||
bindings: ShortcutBinding[];
|
||||
}
|
||||
|
||||
export const FIXED_SHORTCUTS: FixedShortcut[] = [
|
||||
{ label: "Undo", display: "Ctrl + Z", bindings: [{ key: "z", ctrl: true }] },
|
||||
{ i18nKey: "undo", label: "Undo", display: "Ctrl + Z", bindings: [{ key: "z", ctrl: true }] },
|
||||
{
|
||||
i18nKey: "redo",
|
||||
label: "Redo",
|
||||
display: "Ctrl + Shift + Z / Ctrl + Y",
|
||||
bindings: [
|
||||
@@ -36,21 +38,38 @@ export const FIXED_SHORTCUTS: FixedShortcut[] = [
|
||||
{ key: "y", ctrl: true },
|
||||
],
|
||||
},
|
||||
{ label: "Cycle Annotations Forward", display: "Tab", bindings: [{ key: "tab" }] },
|
||||
{
|
||||
i18nKey: "cycleAnnotationsForward",
|
||||
label: "Cycle Annotations Forward",
|
||||
display: "Tab",
|
||||
bindings: [{ key: "tab" }],
|
||||
},
|
||||
{
|
||||
i18nKey: "cycleAnnotationsBackward",
|
||||
label: "Cycle Annotations Backward",
|
||||
display: "Shift + Tab",
|
||||
bindings: [{ key: "tab", shift: true }],
|
||||
},
|
||||
{
|
||||
i18nKey: "deleteSelectedAlt",
|
||||
label: "Delete Selected (alt)",
|
||||
display: "Del / ⌫",
|
||||
bindings: [{ key: "delete" }, { key: "backspace" }],
|
||||
},
|
||||
{ label: "Pan Timeline", display: "Shift + Ctrl + Scroll", bindings: [] },
|
||||
{ label: "Zoom Timeline", display: "Ctrl + Scroll", bindings: [] },
|
||||
{ label: "Frame Back", display: "←", bindings: [{ key: "arrowleft" }] },
|
||||
{ label: "Frame Forward", display: "→", bindings: [{ key: "arrowright" }] },
|
||||
{
|
||||
i18nKey: "panTimeline",
|
||||
label: "Pan Timeline",
|
||||
display: "Shift + Ctrl + Scroll",
|
||||
bindings: [],
|
||||
},
|
||||
{ i18nKey: "zoomTimeline", label: "Zoom Timeline", display: "Ctrl + Scroll", bindings: [] },
|
||||
{ i18nKey: "frameBack", label: "Frame Back", display: "←", bindings: [{ key: "arrowleft" }] },
|
||||
{
|
||||
i18nKey: "frameForward",
|
||||
label: "Frame Forward",
|
||||
display: "→",
|
||||
bindings: [{ key: "arrowright" }],
|
||||
},
|
||||
];
|
||||
|
||||
export type ShortcutConflict =
|
||||
|
||||
Reference in New Issue
Block a user