web/composer: fix autocomplete not overflowing

web/src/ui/RoomView.css

@@ -7,6 +7,7 @@ div.room-view {
 	grid-template:
 		"header" 3rem
 		"messageview" 1fr
+		"autocomplete" 0
 		"input" auto
 		/ 1fr;
 }

web/src/ui/composer/Autocompleter.css

@@ -1,10 +1,11 @@
 div.autocompletions-wrapper {
 	position: relative;
+	grid-area: autocomplete;
 }
 
 div.autocompletions {
 	position: absolute;
-	bottom: 1px;
+	bottom: 0;
 	border-top: 1px solid var(--border-color);
 	border-right: 1px solid var(--border-color);
 	background-color: var(--background-color);

web/src/ui/composer/MessageComposer.css

@@ -1,6 +1,7 @@
 div.message-composer {
 	border-top: 1px solid var(--border-color);
 	overflow: hidden;
+	grid-area: input;
 
 	blockquote.reply-body {
 		pre, a.hicli-matrix-uri {

web/src/ui/composer/MessageComposer.tsx

@@ -355,7 +355,7 @@ const MessageComposer = () => {
 		})
 	})
 	const Autocompleter = getAutocompleter(autocomplete)
-	return <div className="message-composer" ref={composerRef}>
+	return <>
 		{Autocompleter && autocomplete && <div className="autocompletions-wrapper"><Autocompleter
 			params={autocomplete}
 			room={room}
@@ -363,6 +363,7 @@ const MessageComposer = () => {
 			setState={setState}
 			setAutocomplete={setAutocomplete}
 		/></div>}
+		<div className="message-composer" ref={composerRef}>
 			{replyToEvt && <ReplyBody
 				room={room}
 				event={replyToEvt}
@@ -405,6 +406,7 @@ const MessageComposer = () => {
 				<input ref={fileInput} onChange={onAttachFile} type="file" value="" style={{ display: "none" }}/>
 			</div>
 		</div>
+	</>
 }
 
 interface ComposerMediaProps {