Tooltip: Improve accessibility for context menus (#12462)

* Update `ContextMenuTooltipButton.tsx`

* Fix placement

* Update tests

* Update space panel snapshot

* Remove default placement

* Update snapshots

* Fix tooltip child rerender

* Remove useless props title
This commit is contained in:
Florian Duros 2024-05-15 16:25:30 +02:00 committed by GitHub
parent 580bc8771c
commit bec8fdb3d3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 14 additions and 7 deletions

View file

@ -18,9 +18,9 @@ limitations under the License.
import React, { ComponentProps, forwardRef, Ref } from "react";
import AccessibleTooltipButton from "../../components/views/elements/AccessibleTooltipButton";
import AccessibleButton from "../../components/views/elements/AccessibleButton";
type Props<T extends keyof JSX.IntrinsicElements> = ComponentProps<typeof AccessibleTooltipButton<T>> & {
type Props<T extends keyof JSX.IntrinsicElements> = ComponentProps<typeof AccessibleButton<T>> & {
// whether the context menu is currently open
isExpanded: boolean;
};
@ -31,17 +31,17 @@ export const ContextMenuTooltipButton = forwardRef(function <T extends keyof JSX
ref: Ref<HTMLElement>,
) {
return (
<AccessibleTooltipButton
<AccessibleButton
{...props}
element={element as keyof JSX.IntrinsicElements}
onClick={onClick}
onContextMenu={onContextMenu ?? onClick ?? undefined}
aria-haspopup={true}
aria-expanded={isExpanded}
forceHide={isExpanded}
disableTooltip={isExpanded}
ref={ref}
>
{children}
</AccessibleTooltipButton>
</AccessibleButton>
);
});