Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-18 09:20:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

🗣 feat: MCP Status Accessibility Improvements (#10738)

Browse source 
* feat: make MultiSelect highlight same opacity as other focus highlights in app

* feat: add better screenreader announcements for mcp server and variable states

* feat: memoize fullTitle calculation
This commit is contained in:
Dustin Healy 2025-12-01 07:08:28 -08:00 • committed by Danny Avila
parent ad6ba4b6d1
commit 1a38e2a081
No known key found for this signature in database
GPG key ID: BF31EEB2C5CA0956
4 changed files with 49 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

27
client/src/components/MCP/CustomUserVarsSection.tsx
View file

@ -27,6 +27,7 @@ interface AuthFieldProps {
function AuthField({ name, config, hasValue, control, errors }: AuthFieldProps) {
const localize = useLocalize();
const statusText = hasValue ? localize('com_ui_set') : localize('com_ui_unset');
const sanitizer = useMemo(() => {
const instance = DOMPurify();
@ -60,19 +61,21 @@ function AuthField({ name, config, hasValue, control, errors }: AuthFieldProps)
<div className="space-y-2">
<div className="flex items-center justify-between">
<Label htmlFor={name} className="text-sm font-medium">
{config.title}
{config.title} <span className="sr-only">({statusText})</span>
</Label>
{hasValue ? (
<div className="flex min-w-fit items-center gap-2 whitespace-nowrap rounded-full border border-border-light px-2 py-0.5 text-xs font-medium text-text-secondary">
<div className="h-1.5 w-1.5 rounded-full bg-green-500" />
<span>{localize('com_ui_set')}</span>
</div>
) : (
<div className="flex min-w-fit items-center gap-2 whitespace-nowrap rounded-full border border-border-light px-2 py-0.5 text-xs font-medium text-text-secondary">
<div className="h-1.5 w-1.5 rounded-full border border-border-medium" />
<span>{localize('com_ui_unset')}</span>
</div>
)}
<div aria-hidden="true">
{hasValue ? (
<div className="flex min-w-fit items-center gap-2 whitespace-nowrap rounded-full border border-border-light px-2 py-0.5 text-xs font-medium text-text-secondary">
<div className="h-1.5 w-1.5 rounded-full bg-green-500" />
<span>{localize('com_ui_set')}</span>
</div>
) : (
<div className="flex min-w-fit items-center gap-2 whitespace-nowrap rounded-full border border-border-light px-2 py-0.5 text-xs font-medium text-text-secondary">
<div className="h-1.5 w-1.5 rounded-full border border-border-medium" />
<span>{localize('com_ui_unset')}</span>
</div>
)}
</div>
</div>
<Controller
name={name}