diff --git a/src/vs/workbench/contrib/void/browser/react/src/quick-edit-tsx/QuickEditChat.tsx b/src/vs/workbench/contrib/void/browser/react/src/quick-edit-tsx/QuickEditChat.tsx index 22976f2a..755c3dec 100644 --- a/src/vs/workbench/contrib/void/browser/react/src/quick-edit-tsx/QuickEditChat.tsx +++ b/src/vs/workbench/contrib/void/browser/react/src/quick-edit-tsx/QuickEditChat.tsx @@ -113,19 +113,19 @@ export const QuickEditChat = ({ {/* text input */} { textAreaRef.current = r textAreaRef_(r) - // sync init value - textAreaFnsRef.current?.setValue(initText ?? '') // if presses the esc key, X r?.addEventListener('keydown', (e) => { if (e.key === 'Escape') onX() }) - }, [textAreaRef_, initText, onX])} + }, [textAreaRef_, onX])} fnsRef={textAreaFnsRef} diff --git a/src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx b/src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx index 2df87e1c..c4f9836a 100644 --- a/src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx +++ b/src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx @@ -3,7 +3,7 @@ * Licensed under the Apache License, Version 2.0. See LICENSE.txt for more information. *--------------------------------------------------------------------------------------*/ -import React, { forwardRef, MutableRefObject, useCallback, useEffect, useId, useRef, useState } from 'react'; +import React, { forwardRef, MutableRefObject, useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'; import { IInputBoxStyles, InputBox } from '../../../../../../../base/browser/ui/inputbox/inputBox.js'; import { defaultCheckboxStyles, defaultInputBoxStyles, defaultSelectBoxStyles } from '../../../../../../../platform/theme/browser/defaultStyles.js'; import { SelectBox } from '../../../../../../../base/browser/ui/selectBox/selectBox.js'; @@ -48,6 +48,7 @@ export const WidgetComponent = ({ ctor, prop export type TextAreaFns = { setValue: (v: string) => void, enable: () => void, disable: () => void } type InputBox2Props = { + initValue?: string | null; placeholder: string; multiline: boolean; fnsRef?: { current: null | TextAreaFns }; @@ -55,61 +56,70 @@ type InputBox2Props = { onKeyDown?: (e: React.KeyboardEvent) => void; onChangeHeight?: (newHeight: number) => void; } -export const VoidInputBox2 = forwardRef(function X({ placeholder, multiline, fnsRef, onKeyDown, onChangeText }, ref) { +export const VoidInputBox2 = forwardRef(function X({ initValue, placeholder, multiline, fnsRef, onKeyDown, onChangeText }, ref) { // mirrors whatever is in ref const textAreaRef = useRef(null) + const [isEnabled, setEnabled] = useState(true) const adjustHeight = useCallback(() => { const r = textAreaRef.current if (!r) return r.style.height = 'auto' // set to auto to reset height, then set to new height - if (r.scrollHeight === 0) return + + if (r.scrollHeight === 0) return requestAnimationFrame(adjustHeight) const h = r.scrollHeight const newHeight = Math.min(h, 500) r.style.height = `${newHeight}px` }, []); - const onChange = useCallback(() => { - const r = textAreaRef.current - if (!r) return - onChangeText?.(r.value) - adjustHeight() - }, [onChangeText, adjustHeight]) + + const fns: TextAreaFns = useMemo(() => ({ + setValue: (val) => { + const r = textAreaRef.current + if (!r) return + r.value = val + onChangeText?.(r.value) + adjustHeight() + }, + enable: () => { setEnabled(true) }, + disable: () => { setEnabled(false) }, + }), [onChangeText, adjustHeight]) + + + + useEffect(() => { + if (initValue) + fns.setValue(initValue) + }, [initValue]) - const [isEnabled, setEnabled] = useState(true) return (