diff --git a/src/app/common/elements/passwordfield.tsx b/src/app/common/elements/passwordfield.tsx index de49ed31..9065d22d 100644 --- a/src/app/common/elements/passwordfield.tsx +++ b/src/app/common/elements/passwordfield.tsx @@ -42,7 +42,7 @@ class PasswordField extends TextField { } render() { - const { decoration, className, placeholder, maxLength, label } = this.props; + const { decoration, className, placeholder, maxLength, label, autoFocus } = this.props; const { focused, internalValue, error, passwordVisible } = this.state; const inputValue = this.props.value ?? internalValue; @@ -55,6 +55,8 @@ class PasswordField extends TextField { onChange: this.handleInputChange, onFocus: this.handleFocus, onBlur: this.handleBlur, + onKeyDown: this.props.onKeyDown, + autoFocus: autoFocus, placeholder: placeholder, maxLength: maxLength, }; diff --git a/src/app/common/modals/userinput.tsx b/src/app/common/modals/userinput.tsx index c43abfc8..47a3c55a 100644 --- a/src/app/common/modals/userinput.tsx +++ b/src/app/common/modals/userinput.tsx @@ -2,6 +2,7 @@ import * as React from "react"; import { GlobalModel } from "@/models"; import { Choose, When, If } from "tsx-control-statements/components"; import { Modal, PasswordField, Markdown } from "@/elements"; +import { checkKeyPressed, adaptFromReactOrNativeKeyEvent } from "@/util/keyutil"; import "./userinput.less"; @@ -9,7 +10,7 @@ export const UserInputModal = (userInputRequest: UserInputRequest) => { const [responseText, setResponseText] = React.useState(""); const [countdown, setCountdown] = React.useState(Math.floor(userInputRequest.timeoutms / 1000)); - const closeModal = React.useCallback(() => { + const handleSendCancel = React.useCallback(() => { GlobalModel.sendUserInput({ type: "userinputresp", requestid: userInputRequest.requestid, @@ -39,6 +40,19 @@ export const UserInputModal = (userInputRequest: UserInputRequest) => { [userInputRequest] ); + function handleTextKeyDown(e: React.KeyboardEvent) { + let waveEvent = adaptFromReactOrNativeKeyEvent(e); + if (checkKeyPressed(waveEvent, "Enter")) { + e.preventDefault(); + e.stopPropagation(); + handleSendText(); + } else if (checkKeyPressed(waveEvent, "Escape")) { + e.preventDefault(); + e.stopPropagation(); + handleSendCancel(); + } + } + React.useEffect(() => { let timeout: ReturnType; if (countdown == 0) { @@ -55,7 +69,7 @@ export const UserInputModal = (userInputRequest: UserInputRequest) => { return ( - +
@@ -65,13 +79,19 @@ export const UserInputModal = (userInputRequest: UserInputRequest) => {
- + handleTextKeyDown(e)} + />
- +