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

📢 fix: Resolved Screen Reader Issues with TooltipAnchor (#10580)

Browse source 
TooltipAnchor was automatically adding an `aria-describedby`
tag which often duplicated the labeling already present inside
of the anchor. E.g., the screen reader might say
"New Chat, New Chat, button" instead of just "New Chat, button."

I've removed the TooltipAnchor's automatic `aria-describedby` and
worked to make sure that anyone using TooltipAnchor properly defines
its labeling.
This commit is contained in:
Daniel Lew 2025-11-19 16:10:10 -06:00 • committed by GitHub
parent 8b9afd5965
commit 014eb10662
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 49 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

3
packages/client/src/components/Tooltip.tsx
View file

@ -21,7 +21,6 @@ export const TooltipAnchor = forwardRef<HTMLDivElement, TooltipAnchorProps>(func
const mounted = Ariakit.useStoreState(tooltip, (state) => state.mounted);
const placement = Ariakit.useStoreState(tooltip, (state) => state.placement);
const id = useId();
const sanitizer = useMemo(() => {
const instance = DOMPurify();
instance.addHook('afterSanitizeAttributes', (node) => {
@ -79,7 +78,6 @@ export const TooltipAnchor = forwardRef<HTMLDivElement, TooltipAnchorProps>(func
{...props}
ref={ref}
role={role}
aria-describedby={id}
onKeyDown={handleKeyDown}
className={cn('cursor-pointer', className)}
/>
@ -89,7 +87,6 @@ export const TooltipAnchor = forwardRef<HTMLDivElement, TooltipAnchorProps>(func
gutter={4}
alwaysVisible
className="tooltip"
id={id}
render={
<motion.div
initial={{ opacity: 0, x, y }}