Danila Poyarkov
a497fccd06
Follow-up to #717. Replaces all remaining hardcoded keybinding hints with configurable ones. - Add pasteImage to AppAction so it can be configured in keybindings.json - Create keybinding-hints.ts with reusable helper functions: - editorKey(action) / appKey(keybindings, action) - get key display string - keyHint(action, desc) / appKeyHint(kb, action, desc) / rawKeyHint(key, desc) - styled hints - Export helpers from components/index.ts for extensions - Update all components to use configured keybindings - Remove now-unused getDisplayString() from KeybindingsManager and EditorKeybindingsManager - Use keybindings.matches() instead of matchesKey() for pasteImage in custom-editor.ts
76 lines
2.0 KiB
TypeScript
76 lines
2.0 KiB
TypeScript
/**
|
|
* Simple text input component for extensions.
|
|
*/
|
|
|
|
import { Container, getEditorKeybindings, Input, Spacer, Text, type TUI } from "@mariozechner/pi-tui";
|
|
import { theme } from "../theme/theme.js";
|
|
import { CountdownTimer } from "./countdown-timer.js";
|
|
import { DynamicBorder } from "./dynamic-border.js";
|
|
import { keyHint } from "./keybinding-hints.js";
|
|
|
|
export interface ExtensionInputOptions {
|
|
tui?: TUI;
|
|
timeout?: number;
|
|
}
|
|
|
|
export class ExtensionInputComponent extends Container {
|
|
private input: Input;
|
|
private onSubmitCallback: (value: string) => void;
|
|
private onCancelCallback: () => void;
|
|
private titleText: Text;
|
|
private baseTitle: string;
|
|
private countdown: CountdownTimer | undefined;
|
|
|
|
constructor(
|
|
title: string,
|
|
_placeholder: string | undefined,
|
|
onSubmit: (value: string) => void,
|
|
onCancel: () => void,
|
|
opts?: ExtensionInputOptions,
|
|
) {
|
|
super();
|
|
|
|
this.onSubmitCallback = onSubmit;
|
|
this.onCancelCallback = onCancel;
|
|
this.baseTitle = title;
|
|
|
|
this.addChild(new DynamicBorder());
|
|
this.addChild(new Spacer(1));
|
|
|
|
this.titleText = new Text(theme.fg("accent", title), 1, 0);
|
|
this.addChild(this.titleText);
|
|
this.addChild(new Spacer(1));
|
|
|
|
if (opts?.timeout && opts.timeout > 0 && opts.tui) {
|
|
this.countdown = new CountdownTimer(
|
|
opts.timeout,
|
|
opts.tui,
|
|
(s) => this.titleText.setText(theme.fg("accent", `${this.baseTitle} (${s}s)`)),
|
|
() => this.onCancelCallback(),
|
|
);
|
|
}
|
|
|
|
this.input = new Input();
|
|
this.addChild(this.input);
|
|
this.addChild(new Spacer(1));
|
|
this.addChild(new Text(`${keyHint("selectConfirm", "submit")} ${keyHint("selectCancel", "cancel")}`, 1, 0));
|
|
this.addChild(new Spacer(1));
|
|
this.addChild(new DynamicBorder());
|
|
}
|
|
|
|
handleInput(keyData: string): void {
|
|
const kb = getEditorKeybindings();
|
|
if (kb.matches(keyData, "selectConfirm") || keyData === "\n") {
|
|
this.onSubmitCallback(this.input.getValue());
|
|
} else if (kb.matches(keyData, "selectCancel")) {
|
|
this.onCancelCallback();
|
|
} else {
|
|
this.input.handleInput(keyData);
|
|
}
|
|
}
|
|
|
|
dispose(): void {
|
|
this.countdown?.dispose();
|
|
}
|
|
}
|