From e041a7d6e2a8140c1518efb9b464c1d6ec6a6af0 Mon Sep 17 00:00:00 2001
From: akinshaywai <akinshaywai@users.noreply.github.com>
Date: Tue, 28 Apr 2026 21:36:12 +0100
Subject: [PATCH] fix(a11y): add aria-label to scroll-to-bottom button in
 MessageInput

The scroll-to-bottom button appeared when the user scrolled away from
the latest message, but it contained only an SVG arrow with no
accessible name. Added aria-label and aria-hidden on the decorative SVG.

Addresses WCAG 2.1 SC 4.1.2 (Name, Role, Value).
---
 src/lib/components/chat/MessageInput.svelte | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/lib/components/chat/MessageInput.svelte b/src/lib/components/chat/MessageInput.svelte
index 11cd749987..a0db8dd643 100644
--- a/src/lib/components/chat/MessageInput.svelte
+++ b/src/lib/components/chat/MessageInput.svelte
@@ -1169,6 +1169,7 @@
 						>
 							<button
 								class=" bg-white border border-gray-100 dark:border-none dark:bg-white/20 p-1.5 rounded-full pointer-events-auto"
+								aria-label={$i18n.t('Scroll to bottom')}
 								on:click={() => {
 									autoScroll = true;
 									scrollToBottom();
@@ -1179,6 +1180,7 @@
 									viewBox="0 0 20 20"
 									fill="currentColor"
 									class="w-5 h-5"
+									aria-hidden="true"
 								>
 									<path
 										fill-rule="evenodd"