From 5372577430c3ce9ff5beb567674a30c4ddf43dfd Mon Sep 17 00:00:00 2001
From: G30 <50341825+silentoplayz@users.noreply.github.com>
Date: Sat, 24 Oct 2026 23:15:42 -0400
Subject: [PATCH] fix(a11y): the Visibility button's name includes the choice
 it shows (#33125)

---
 src/lib/components/workspace/common/AccessControl.svelte | 2 +-
 src/lib/components/workspace/common/Visibility.svelte    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/workspace/common/AccessControl.svelte b/src/lib/components/workspace/common/AccessControl.svelte
index da594dd5f4..8f5400146b 100644
--- a/src/lib/components/workspace/common/AccessControl.svelte
+++ b/src/lib/components/workspace/common/AccessControl.svelte
@@ -503,7 +503,6 @@
 			<Dropdown closeOnSelect>
 				<button
 					type="button"
-					aria-label={labels.title ?? $i18n.t('Visibility')}
 					class="flex h-6 items-center gap-2 rounded-md text-[0.8125rem] font-medium text-gray-800 transition hover:text-gray-950 dark:text-gray-200 dark:hover:text-white"
 				>
 					{#if visibility === 'private'}
@@ -511,6 +510,7 @@
 					{:else}
 						<GlobeAlt className="size-3.5 text-gray-500 dark:text-gray-400" />
 					{/if}
+					<span class="sr-only">{labels.title ?? $i18n.t('Visibility')}</span>
 					<span>{visibilityOptions.find((option) => option.value === visibility)?.label}</span>
 					<ChevronDown className="size-3 text-gray-400 dark:text-gray-500" strokeWidth="2" />
 				</button>
diff --git a/src/lib/components/workspace/common/Visibility.svelte b/src/lib/components/workspace/common/Visibility.svelte
index a4e14ff92f..4bb77d9b9a 100644
--- a/src/lib/components/workspace/common/Visibility.svelte
+++ b/src/lib/components/workspace/common/Visibility.svelte
@@ -22,7 +22,6 @@
 	<Dropdown closeOnSelect>
 		<button
 			type="button"
-			aria-label={$i18n.t('Visibility')}
 			class="flex h-6 items-center gap-2 rounded-md text-[0.8125rem] font-medium text-gray-800 transition hover:text-gray-950 dark:text-gray-200 dark:hover:text-white"
 		>
 			{#if state === 'private'}
@@ -30,6 +29,7 @@
 			{:else}
 				<Hashtag className="size-3.5 text-gray-500 dark:text-gray-400" />
 			{/if}
+			<span class="sr-only">{$i18n.t('Visibility')}</span>
 			<span>{state === 'private' ? $i18n.t('Private') : $i18n.t('Public')}</span>
 			<ChevronDown className="size-3 text-gray-400 dark:text-gray-500" strokeWidth="2" />
 		</button>