Fix resizing behavior caret position

This commit is contained in:
Saoud Rizwan
2024-09-02 03:30:37 -04:00
parent 4237d6c250
commit 66542f94fd

View File

@@ -77,6 +77,8 @@ const Terminal: React.FC<TerminalProps> = ({ rawOutput, handleSendStdin, shouldA
"whiteSpace", "whiteSpace",
"wordSpacing", "wordSpacing",
"wordWrap", "wordWrap",
"width",
"height",
] ]
stylesToCopy.forEach((property) => { stylesToCopy.forEach((property) => {
@@ -91,13 +93,15 @@ const Terminal: React.FC<TerminalProps> = ({ rawOutput, handleSendStdin, shouldA
hiddenTextarea.style.whiteSpace = "pre-wrap" hiddenTextarea.style.whiteSpace = "pre-wrap"
hiddenTextarea.style.overflowWrap = "break-word" hiddenTextarea.style.overflowWrap = "break-word"
const borderWidth = parseInt(textareaStyles.borderWidth, 10) || 0 // const borderWidth = parseInt(textareaStyles.borderWidth, 10) || 0
const updateSize = () => { const updateSize = () => {
hiddenTextarea.value = textarea.value hiddenTextarea.value = textarea.value
const newHeight = hiddenTextarea.scrollHeight const newHeight = hiddenTextarea.scrollHeight
textarea.style.height = `${newHeight}px` textarea.style.height = `${newHeight}px`
mirror.style.width = `${textarea.clientWidth + 2 * borderWidth}px` mirror.style.width = `${textarea.offsetWidth}px`
mirror.style.height = `${newHeight}px` mirror.style.height = `${newHeight}px`
hiddenTextarea.style.width = `${textarea.offsetWidth}px`
hiddenTextarea.style.height = `${newHeight}px`
} }
updateSize() updateSize()
@@ -247,8 +251,7 @@ const Terminal: React.FC<TerminalProps> = ({ rawOutput, handleSendStdin, shouldA
border: "1px solid var(--vscode-editorGroup-border)", border: "1px solid var(--vscode-editorGroup-border)",
outline: "none", outline: "none",
whiteSpace: "pre-wrap", whiteSpace: "pre-wrap",
overflowX: "hidden", overflow: "hidden",
overflowY: "hidden",
width: "100%", width: "100%",
boxSizing: "border-box", boxSizing: "border-box",
resize: "none", resize: "none",
@@ -260,6 +263,7 @@ const Terminal: React.FC<TerminalProps> = ({ rawOutput, handleSendStdin, shouldA
{` {`
.terminal-container { .terminal-container {
position: relative; position: relative;
overflow: hidden; // Add this
} }
.terminal-textarea { .terminal-textarea {
@@ -333,6 +337,9 @@ const Terminal: React.FC<TerminalProps> = ({ rawOutput, handleSendStdin, shouldA
position: "absolute", position: "absolute",
top: 0, top: 0,
left: 0, left: 0,
height: "100%",
width: "100%",
overflow: "hidden",
opacity: 0, opacity: 0,
...(textAreaStyle as any), ...(textAreaStyle as any),
}} }}