rixty/SillyTavern
1
0
Fork 0
mirror of https://github.com/SillyTavern/SillyTavern.git synced 2025-06-05 21:59:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #3210 from SillyTavern/sendtextarea-fieldsizing

Browse Source 
Use CSS resizing for send textarea
This commit is contained in:
Cohee
2024-12-21 17:56:13 +02:00
committed by GitHub
parent 1f22b9c6bc 21ee072677
commit f794b7621f
3 changed files with 61 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
public/scripts/RossAscends-mods.js
View File

@@ -887,7 +887,40 @@ export function initRossMods() {
saveSettingsDebounced();
});
const cssAutofit = CSS.supports('field-sizing', 'content');
if (cssAutofit) {
let lastHeight = chatBlock.offsetHeight;
const chatBlockResizeObserver = new ResizeObserver((entries) => {
for (const entry of entries) {
if (entry.target !== chatBlock) {
continue;
}
const threshold = 1;
const newHeight = chatBlock.offsetHeight;
const deltaHeight = newHeight - lastHeight;
const isScrollAtBottom = Math.abs(chatBlock.scrollHeight - chatBlock.scrollTop - newHeight) <= threshold;
if (!isScrollAtBottom && Math.abs(deltaHeight) > threshold) {
chatBlock.scrollTop -= deltaHeight;
}
lastHeight = newHeight;
}
});
chatBlockResizeObserver.observe(chatBlock);
}
sendTextArea.addEventListener('input', () => {
saveUserInputDebounced();
if (cssAutofit) {
// Unset modifications made with a manual resize
sendTextArea.style.height = 'auto';
return;
}
const hasContent = sendTextArea.value !== '';
const fitsCurrentSize = sendTextArea.scrollHeight <= sendTextArea.offsetHeight;
const isScrollbarShown = sendTextArea.clientWidth < sendTextArea.offsetWidth;
@@ -895,7 +928,6 @@ export function initRossMods() {
const needsDebounce = hasContent && (fitsCurrentSize || (isScrollbarShown && isHalfScreenHeight));
if (needsDebounce) autoFitSendTextAreaDebounced();
else autoFitSendTextArea();
saveUserInputDebounced();
});
restoreUserInput();