fix: chat-input tremor during typing
Stabilization in adjustTextareaHeight() in input-store.js: after setting height from scrollHeight, we do one extra read and apply Math.max of the post-set scrollHeight and the value just assigned. This catches any layout shift triggered by the height assignment itself, so the box always lands at the correct height without oscillating. Also removed field-sizing: content from #chat-input, which was conflicting with the JS-driven height and amplifying the jumps into visible trembling.
Alessandro committed
Mar 16, 2026 at 14:20 UTC
a0fc9367b7cd11fbccc5c5a7d63023e99a79ef2a
2 files changed
+2
-1
webui/components/chat/input/chat-bar-input.html
-1
@@ -86,7 +86,6 @@
86
font-size: 0.9rem;
87
max-height: clamp(7rem, 40vh, 20rem);
88
min-height: 3.05rem;
89
- field-sizing: content;
89
width: 100%;
90
padding: 0.48rem 40px var(--spacing-sm) var(--spacing-sm);
91
margin-right: var(--spacing-xs);
webui/components/chat/input/input-store.js
+2
@@ -67,6 +67,8 @@ const model = {
67
if (!this.message) chatInput.value = "";
68
chatInput.style.height = "auto";
69
chatInput.style.height = chatInput.scrollHeight + "px";
70
+ // pick up any layout shift triggered by the height assignment
71
+ chatInput.style.height = Math.max(chatInput.scrollHeight, parseInt(chatInput.style.height)) + "px";
72
}
73
},
74